Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Import geoman with leaflet as an es module #1339

Open
AronSchoffer opened this issue Mar 19, 2023 · 5 comments
Open

Import geoman with leaflet as an es module #1339

AronSchoffer opened this issue Mar 19, 2023 · 5 comments

Comments

@AronSchoffer
Copy link

I have trouble importing geoman after importing leaflet as an es module.

This works fine:

import './node_modules/leaflet/dist/leaflet.js';
import './node_modules/@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.min.js';

This doesn't:

import * as L from './node_modules/leaflet/dist/leaflet-src.esm.js';
import './node_modules/@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.min.js';

and gives the following error: leaflet-geoman.min.js:1 Uncaught ReferenceError: L is not defined.

Here is repo with a minimal example: https://github.com/AronSchoffer/import-geoman-with-leaflet-as-esm

I want to import leaflet as esm because typescript gives me errors otherwise.
Maybe more importantly, importing leaflet as an es module allows for partial imports e.g. import {map} from leaflet.

Does geoman support importing leaflet as an es module? If so, how do I do this properly?
Any workarounds would also be appreciated.
Thanks!

@Falke-Design
Copy link
Collaborator

Please try Lazy Loading.

@AronSchoffer
Copy link
Author

That still gives the same error.
I am not using a bundler, could that be a problem?

I updated the repo so it now tries to lazy load geoman, if you want to see for yourself.

@ykparkwixon
Copy link

I cannot get js on https://unpkg.com/@geoman-io/leaflet-geoman-free@latest/dist/leaflet-geoman.min.js

I can't see the map on https://geoman.io/leaflet-geoman also.

What happened?

@AronSchoffer
Copy link
Author

Any news on this?
If I understand correctly, Leaflet is moving towards esm support so shouldn't this be working if Leaflet officially starts supporting esmodules?

My use case is that I want to use the Leaflet map in a vanilla web component which in turn can be embedded in a different site. So I'd rather avoid globally importing Leaflet.

@AndrejGajdos
Copy link

I have the same issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants