GeoTIFF/georaster-layer-for-leaflet

Error [ERR_REQUIRE_ESM]

nikkopante opened this issue · 0 comments

Describe the bug
I want build a web map with COG, and found this plugin for Leaflet. I am trying the tutorial and cannot require or import the plugin georaster-layer-for-leaflet correctly. I get this error when importing the plugin.

var GeoRasterLayer = require("georaster-layer-for-leaflet");
                     ^

Error [ERR_REQUIRE_ESM]: require() of ES Module C:\Users\Example\Documents\sinag\georaster-app\node_modules\georaster-layer-for-leaflet\dist\v3\babel\cjs\georaster-layer-for-leaflet.js from C:\Users\Example\Documents\sinag\georaster-app\index.js not supported.
georaster-layer-for-leaflet.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead rename georaster-layer-for-leaflet.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in C:\Users\Example\Documents\sinag\georaster-app\node_modules\georaster-layer-for-leaflet\package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).

I have changed the "type": "module" to "type": "commonjs" as this is the simplest between the two proposed solutions. However, this will result to a new error:

  var requestFn = window.requestAnimationFrame || getPrefixed('RequestAnimationFrame') || timeoutDefer;
                  ^

ReferenceError: window is not defined
    at C:\Users\Example\Documents\sinag\georaster-app\node_modules\leaflet\dist\leaflet-src.js:230:19
    at C:\Users\Example\Documents\sinag\georaster-app\node_modules\leaflet\dist\leaflet-src.js:7:66
    at Object.<anonymous> (C:\Users\Example\Documents\sinag\georaster-app\node_modules\leaflet\dist\leaflet-src.js:10:3)
    at Module._compile (node:internal/modules/cjs/loader:1159:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1213:10)
    at Module.load (node:internal/modules/cjs/loader:1037:32)
    at Module._load (node:internal/modules/cjs/loader:878:12)
    at Module.require (node:internal/modules/cjs/loader:1061:19)
    at require (node:internal/modules/cjs/helpers:103:18)
    at Object.<anonymous> (C:\Users\Example\Documents\sinag\georaster-app\node_modules\georaster-layer-for-leaflet\dist\v3\babel\cjs\georaster-layer-for-leaflet.js:10:33)

How can I import/require the plugin properly?

To Reproduce
Steps to reproduce the behavior:

  1. I have made the repo available here: https://github.com/nikkopante/georaster-app , in case someone wants to check...