Could you help me please?
I have installed the latest version 9.6.5 of ol. Built the PDCDashboard. Fixed my code to import modules according file system of the package and proper calls, ex:
import OSM from '../../../node_modules/ol/source/OSM.js';
import TileLayer from '../../../node_modules/ol/layer/Tile.js';
import View from '../../../node_modules/ol/View.js';
import Overlay from '../../../node_modules/ol/Overlay.js';
import Polygon from '../../../node_modules/ol/geom/Polygon.js';
import Map from '../../../node_modules/ol/Map.js';
this.map = new Map({
layers: map_layer,
target: olmap,
view: view
});
Everything looks like in examples of ol.
When I run the project, I can see that all modules imported successfully except Map.
I got error Cannot use import statement outside a module
enter image description here
If I understand right this is because of conflict between module systems in JavaScript: CommonJS and ES6 Modules.
There are several solutions in internet to solve it but the do not work for me.
1. Put "type": "module" setting in the nearest package.json file. I can see that ol/package.json already has it.
2. Rename *.js to *.mjs. I cannot rename files int ol package, because they are prebuilt
3. Use dynamic import. Again I cannot change the code of ol.
4. Maybe the latest version of Node.js support together CommonJS and ES6 module systems. I use Node.js v18.20.3. The latest version is 22.3.0. We cannot use it now, because we will get conflict with node-sass. I tried and Oleg confirmed it.
5. Adding <script type="module">mport Map from '../../../node_modules/ol/Map.js';</script> does not help at all. And I cannot change Map.js
6. I tried to call ol from dist folder where it should be minimized like it was in earlier version. And failed.
End etc. I checked all hypothesis I have found.
The main problem that openlayer package is prebuilt. Maybe it can be rebuild? How knows?
Maybe you have any idea how to solve it.
New contributor
Ирина Лунева is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.