question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

esri-leaflet throws error when bundled with Rollup

See original GitHub issue
  • Browser and version: n/a

  • Version of Leaflet (L.version): 1.5.1

  • Version of esri Leaflet (L.esri.VERSION): 2.3.0

  • Version of Rollup: 1.21.2

  • Steps to reproduce the error:

    1. yarn add esri-leaflet
    2. Write some code to import { tiledMapLayer } from ‘esri-leaflet’
    3. rollup
  • What happens is [X]. I get an error:

[!] (plugin buble) SyntaxError: Unexpected token (2:8)
node_modules/esri-leaflet/package.json (2:8)
1 : {
2 :   "name": "esri-leaflet",
            ^
SyntaxError: Unexpected token (2:8)
    at Object.pp$4.raise (/node_modules/acorn/dist/acorn.js:2825:15) was expecting [Y].

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:7 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
jgravoiscommented, Sep 20, 2019

Esri-leaflet isn’t a CommonJS library. it’s written in ES6.

you may have other problems, but at a minimum, you need to tell rollup-plugin-commonjs about that (or omit the plugin entirely if you aren’t actually trying to bundle any CJS dependencies).

plugins: [
  cjs({ exclude: [ 'node_modules/esri-leaflet/**' ] }),
]
1reaction
gavinrcommented, Sep 19, 2019

I am trying to follow your replication steps, I do not get the error:

  1. Create new directory
  2. npm install --global rollup (this installs v1.21.4)
  3. npm init -y
  4. npm install esri-leaflet
  5. create main.js with contents:
import { tiledMapLayer } from 'esri-leaflet';
  1. rollup main.js --format iife --name "myBundle" --file bundle.js

Outputs:

main.js → bundle.js...
(!) Unresolved dependencies
https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
esri-leaflet (imported by main.js)
(!) Unused external imports
tiledMapLayer imported from external module 'esri-leaflet' but never used
(!) Missing global variable name
Use output.globals to specify browser global variable names corresponding to external modules
esri-leaflet (guessing 'esriLeaflet')
created bundle.js in 33ms
Read more comments on GitHub >

github_iconTop Results From Across the Web

esri-leaflet | Yarn - Package Manager
Fast, reliable, and secure dependency management.
Read more >
Converting ArcGIS Server JSON to GeoJSON?
I downloaded FWTools. When I run that command, I get the error 'Unable to open datasource 'My URL here' with the following drivers....
Read more >
Using the ArcGIS API for JavaScript in Applications built with ...
Exclude ArcGIS API modules from any bundling done by other module loaders; Load the ArcGIS API for JavaScript via a script tag on...
Read more >
How to use rollup with Leaflet 1.1.0 to create a single bundle?
After running it through rollup I'm getting a parse error on a line which I've traced to leaflet/src/Leaflet.js at line 35: window.L =...
Read more >
How to diagnose error rendering Esri_2020_Land_Cov...
Solved: Dear Community. I am trying to load in ESRI's new 10m land cover data to a Leaflet map, but having trouble.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found