Search code examples
angulararcgisarcgis-js-api

Build error Angular 11 and ArcGIS: You may need an additional loader to handle the result of these loaders


The same branch with the same code has no build errors for 1 dev with Node v12.20.0 and Npm 8.13.1. 2 other devs with the same version of Node and Npm cannot build the same code (one Windows and one Linux machine).

Is there anything other than Node and Npm that could be different here? We are all building (or trying to build) the same branch, the same code.

Error: ./node_modules/@arcgis/core/core/has.js 5:101
Module parse failed: Unexpected token (5:101)
File was processed with these loaders:
 * ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js
 * ./node_modules/@ngtools/webpack/src/ivy/index.js
You may need an additional loader to handle the result of these loaders.
| See https://js.arcgis.com/4.24/esri/copyright.txt for details.
| */
> let e;function a(a){return"function"==typeof e[a]?e[a]=e[a](globalThis):e[a]}e=globalThis.dojoConfig?.has||globalThis.esriConfig?.has?{...globalThis.dojoConfig?.has,...globalThis.esriConfig?.has}:{},a.add=(d,o,r,i)=>((i||void 0===e[d])&&(e[d]=o),r&&a(d)),a.cache=e,a.add("esri-deprecation-warnings",!0),(()=>{a.add("host-webworker",void 0!==globalThis.WorkerGlobalScope&&self instanceof globalThis.WorkerGlobalScope);const e="undefined"!=typeof window&&"undefined"!=typeof location&&"undefined"!=typeof document&&window.location===location&&window.document===document;if(a.add("host-browser",e),a.add("host-node","object"==typeof globalThis.process&&globalThis.process.versions?.node&&globalThis.process.versions.v8),a.add("dom",e),a("host-browser")){const e=navigator,d=e.userAgent,o=e.appVersion,r=parseFloat(o);if(a.add("wp",parseFloat(d.split("Windows Phone")[1])||void 0),a.add("msapp",parseFloat(d.split("MSAppHost/")[1])||void 0),a.add("khtml",o.includes("Konqueror")?r:void 0),a.add("edge",parseFloat(d.split("Edge/")[1])||void 0),a.add("opr",parseFloat(d.split("OPR/")[1])||void 0),a.add("webkit",!a("wp")&&!a("edge")&&parseFloat(d.split("WebKit/")[1])||void 0),a.add("chrome",!a("edge")&&!a("opr")&&parseFloat(d.split("Chrome/")[1])||void 0),a.add("android",!a("wp")&&parseFloat(d.split("Android ")[1])||void 0),a.add("safari",!o.includes("Safari")||a("wp")||a("chrome")||a("android")||a("edge")||a("opr")?void 0:parseFloat(o.split("Version/")[1])),a.add("mac",o.includes("Macintosh")),!a("wp")&&d.match(/(iPhone|iPod|iPad)/)){const e=RegExp.$1.replace(/P/,"p"),o=d.match(/OS ([\d_]+)/)?RegExp.$1:"1",r=parseFloat(o.replace(/_/,".").replace(/_/g,""));a.add(e,r),a.add("ios",r)}a.add("trident",parseFloat(o.split("Trident/")[1])||void 0),a("webkit")||(!d.includes("Gecko")||a("wp")||a("khtml")||a("trident")||a("edge")||a.add("mozilla",r),a("mozilla")&&a.add("ff",parseFloat(d.split("Firefox/")[1]||d.split("Minefield/")[1])||void 0))}})(),(()=>{if(globalThis.navigator){const e=navigator.userAgent,d=/Android|webOS|iPhone|iPad|iPod|BlackBerry|Opera Mini|IEMobile/i.test(e),o=/iPhone/i.test(e);d&&a.add("esri-mobile",d),o&&a.add("esri-iPhone",o),a.add("esri-geolocation",!!navigator.geolocation)}a.add("esri-canvas-svg-support",!a("trident")),a.add("esri-wasm","WebAssembly"in globalThis),a.add("esri-shared-array-buffer",(()=>{const e="SharedArrayBuffer"in globalThis,a=!1===globalThis.crossOriginIsolated;return e&&!a})),a.add("wasm-simd",(()=>{const e=[0,97,115,109,1,0,0,0,1,5,1,96,0,1,123,3,2,1,0,10,10,1,8,0,65,0,253,15,253,98,11];return WebAssembly.validate(new Uint8Array(e))})),a.add("esri-atomics","Atomics"in globalThis),a.add("esri-workers","Worker"in globalThis),a.add("web-feat:cache","caches"in globalThis),a.add("esri-workers-arraybuffer-transfer",!a("safari")||Number(a("safari"))>=12),a.add("featurelayer-simplify-thresholds",[.5,.5,.5,.5]),a.add("featurelayer-simplify-payload-size-factors",[1,1,4]),a.add("featurelayer-snapshot-enabled",!0),a.add("featurelayer-snapshot-point-min-threshold",8e4),a.add("featurelayer-snapshot-point-max-threshold",4e5),a.add("featurelayer-snapshot-point-coverage",.1),a.add("featurelayer-advanced-symbols",!1),a.add("featurelayer-pbf",!0),a.add("featurelayer-pbf-statistics",!1),a.add("feature-layers-workers",!0),a.add("feature-polyline-generalization-factor",1),a.add("mapview-transitions-duration",200),a.add("mapview-srswitch-adjust-rotation-scale-threshold",24e6),a.add("mapserver-pbf-enabled",!1),a.add("mapimagelayer-popup-identify-max-tolerance",20),a.add("heatmap-allow-raster-fallback",!0),a.add("heatmap-force-raster",!1),a("host-webworker")||a("host-browser")&&(a.add("esri-csp-restrictions",(()=>{try{new Function}catch{return!0}return!1})),a.add("esri-image-decode",(()=>{if("decode"in new Image){const e=new Image;return e.src='data:image/svg+xml;charset=UTF-8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg"></svg>',void e.decode().then((()=>{a.add("esri-image-decode",!0,!0,!0)})).catch((()=>{a.add("esri-image-decode",!1,!0,!0)}))}return!1})),a.add("esri-url-encodes-apostrophe",(()=>{const e=window.document.createElement("a");return e.href="?'",e.href.includes("?%27")})))})();export{a as default};
| 
 @ ./node_modules/@arcgis/core/geometry/Extent.js 5:233-256
 @ ./node_modules/@arcgis/core/geometry/Polygon.js
 @ ./src/app/features/header/title/senterlinje/senterlinje.component.ts
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi ./src/main.ts

This is just a small part of the error, i was unable to post more of the error message because of the stackoverflow error "This looks like spam."


Solution

  • Solved by changing:

    "@arcgis/core": "^4.23.7",
    "eslint-plugin-import": "latest",
    "eslint-plugin-jsdoc": "latest",
    "eslint-plugin-prefer-arrow": "latest",
    

    To:

    "@arcgis/core": "4.20.2",
    "eslint-plugin-import": "2.26.0",
    "eslint-plugin-jsdoc": "38.1.6",
    "eslint-plugin-prefer-arrow": "1.2.3",
    

    In package.json​