Locally built leaflet package does not initialize correctly
See original GitHub issueChecklist
- I’ve looked at the documentation to make sure the behavior isn’t documented and expected.
- I’m sure this is an issue with Leaflet, not with my app or other dependencies (Angular, Cordova, React, etc.).
- I’ve searched through the current issues to make sure this hasn’t been reported yet.
- I agree to follow the Code of Conduct that this project adheres to.
Steps to reproduce
- switch to NodeJS version 16. [My guess other versions have the same issue. I was unable to build 1.9.2 with older [v12 and/or v14] versions of NodeJS.
- execute
npm install
- execute
npm run build
- optionally execute
npm publish
after addingpublishConfig
to the registry and scoping the package name eg@private/leaflet
Expected behavior
I expect to get a package similar to the one published to the npm registry. However, it seems that the package transpiled differently. Specifically, for Leaflet 1.9.2 from npm
, the result is:
_updateCircle: function (layer) {
var p = layer._point,
r = Math.max(Math.round(layer._radius), 1),
r2 = Math.max(Math.round(layer._radiusY), 1) || r,
arc = 'a' + r + ',' + r2 + ' 0 1,0 ';
// drawing a circle with two half-arcs
var d = layer._empty() ? 'M0 0' :
'M' + (p.x - r) + ',' + p.y +
arc + (r * 2) + ',0 ' +
arc + (-r * 2) + ',0 ';
this._setPath(layer, d);
},
My package has the same function transpiled to:
_updateCircle(layer) {
const p = layer._point,
r = Math.max(Math.round(layer._radius), 1),
r2 = Math.max(Math.round(layer._radiusY), 1) || r,
arc = `a${r},${r2} 0 1,0 `;
// drawing a circle with two half-arcs
const d = layer._empty() ? 'M0 0' :
`M${p.x - r},${p.y
}${arc}${r * 2},0 ${
arc}${-r * 2},0 `;
this._setPath(layer, d);
},
Current behavior
I don’t really care about the ECMAScript version. Modern browsers understand both. My issue is with the package initialization. The package that leaflet built for me locally, fails to initialize. For example, I cannot import plugins. The below is the code:
import * as L from 'leaflet';
import 'leaflet-editable-marker';
import '@geoman-io/leaflet-geoman-free';
import 'leaflet-toolbar';
import '@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css';
import 'leaflet-toolbar/dist/leaflet.toolbar.min.css';
import 'leaflet/dist/leaflet.css';
console.log('leaflet editable marker:', L.EditableMarker);
Is working just fine with regular 1.9.2
and it prints:
leaflet editable marker: ƒ () {
setOptions(this); // call the constructor
if (this.initialize) {
this.initialize.apply(this, arguments);
} // call all constructor hooks
this.callInitHooks();
When I use the homebrew package, it does:
Attempted import error: 'EditableMarker' is not exported from 'leaflet' (imported as 'L')
and
leaflet editable marker: undefined
Minimal example reproducing the issue
No response
Environment
- Leaflet version: 1.9.2
- Browser (with version): Chrome 106.0.5249.119 (Official Build) (x86_64)
- OS/Platform (with version): MacOS 10.14.6
Issue Analytics
- State:
- Created 10 months ago
- Comments:10 (2 by maintainers)
Top Results From Across the Web
Angular Leaflet - Map does does not render properly
Here are the steps you need to follow: 1.install leaflet and import leaflet css style on angular.json "styles": [".
Read more >Leaflet and tiler for R - can't get the correct tiles for displaying ...
I am setting up a webapplication and want to convert .grd files to tiles that can be read by Leaflet. This example can...
Read more >Shiny App Not Working Properly on ShinyApps Server ...
I have created an interactive map using Shiny and Leaflet where countries are shaded based off of their press freedom score (darker, ...
Read more >Leaflet crash course | All you need to know about ... - YouTube
This is the video about the leaflet js basic guidelines. source code: https://github.com/iamtekson/ Leaflet -Basic/tree/master/Basic#leafletjs ...
Read more >Create Interactive Web Maps with the JavaScript 'Leaflet' Library
Package 'leaflet' ... JavaScript library and the 'htmlwidgets' package. ... the name of the group the newly created layers should belong to (for...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@igorshmukler please tone down your language if you want us to help you, and read the responses more carefully. I quoted the relevant bit from @jonkoops above. Stable releases are published from the
v1
branch, whilemain
contains ongoing work on v2 with breaking changes, including a newer ES version.Just puzzles me that nobody would want to see whether the main branch builds, yet not my business really.
In order for me to get the thing to build a valid package, I just needed:
The main might be fixed now, or not. I was able to fork off 1.9.2 and take it from there.