topic Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript in ArcGIS JavaScript Maps SDK Questions

Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

mfcallahan — Sun, 12 Dec 2021 00:12:05 GMT

I've come across an error which I am not quite sure how to diagnose. I have an Angular 7 application which uses the ArcGIS JS API and the arcgis-webpack-plugin, configured similarly to this sample app:

GitHub - Esri/angular-cli-esri-map at arcgis-webpack-angular

I need to use some components of the dojo framework directly, importing them like this:

import * as dojo from 'dojo/dojo';
import * as domProp from 'dojo/dom-prop';

However, I'm receiving this error at run time (the app does build without error):

DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'localhost:4200/dojo/arcgis-js-api/views/2d/layers/features/Pipeline.js' failed to load.

The error is straightforward - the script at '/dojo/arcgis-js-api/views/2d/layers/features/Pipeline.js' fails to load because it does not exist. But I was wondering if anyone can shed some light on this and help me understand what would cause an app to look in the 'dojo' API files for an ArcGIS JS API file. File '/arcgis-js-api/views/2d/layers/features/Pipeline.js' does exist, I'm just not sure what uses Pipeline.js as that is not something I directly reference or import, and why the app looks inside the dojo API for that file.

Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

ReneRubalcava — Sat, 09 Nov 2019 00:27:19 GMT

I'm not familiar with that Angular app, but somewhere you need to set up the worker loader url configuration like this file.

arcgis-cli-app/config.ts at master · odoe/arcgis-cli-app · GitHub

This let's the API know to load the workers from the CDN, because they cannot currently be built with webpack and I don't see that being done in that app, at least not from a quick glance.

I'm pretty sure that is the source of the error you are seeing.

Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

mfcallahan — Tue, 12 Nov 2019 21:01:21 GMT

Thanks for the reply. Can you elaborate on what is meant by "This let's the API know to load the workers from the CDN, because they cannot currently be built with webpack and I don't see that being done in that app..."

Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

ReneRubalcava — Sun, 12 Dec 2021 00:12:08 GMT

In that file above

import esriConfig from "esri/config";

// CDN version of the API
const DEFAULT_WORKER_URL = "https://js.arcgis.com/4.7/";
// Lite AMD loader on the CDN
const DEFAULT_LOADER_URL = `${DEFAULT_WORKER_URL}dojo/dojo-lite.js`;

// You define the `esriConfig.workers.loaderUrl` to point to the CDN
(esriConfig.workers as any).loaderUrl = DEFAULT_LOADER_URL;
esriConfig.workers.loaderConfig = {
  // Set up the loader config
  // to treat the CDN as the base url for workers
  baseUrl: `${DEFAULT_WORKER_URL}dojo`,
  // need to also let the workers know
  // where the module packages are on the CDN
  packages: [
    { name: "esri", location: DEFAULT_WORKER_URL + "esri" },
    { name: "dojo", location: DEFAULT_WORKER_URL + "dojo" },
    { name: "dojox", location: DEFAULT_WORKER_URL + "dojox" },
    { name: "dijit", location: DEFAULT_WORKER_URL + "dijit" },
    { name: "dstore", location: DEFAULT_WORKER_URL + "dstore" },
    { name: "moment", location: DEFAULT_WORKER_URL + "moment" },
    { name: "@dojo", location: DEFAULT_WORKER_URL + "@dojo" },
    {
      name: "cldrjs",
      location: DEFAULT_WORKER_URL + "cldrjs",
      main: "dist/cldr"
    },
    {
      name: "globalize",
      location: DEFAULT_WORKER_URL + "globalize",
      main: "dist/globalize"
    },
    {
      name: "maquette",
      location: DEFAULT_WORKER_URL + "maquette",
      main: "dist/maquette.umd"
    },
    {
      name: "maquette-css-transitions",
      location: DEFAULT_WORKER_URL + "maquette-css-transitions",
      main: "dist/maquette-css-transitions.umd"
    },
    {
      name: "maquette-jsx",
      location: DEFAULT_WORKER_URL + "maquette-jsx",
      main: "dist/maquette-jsx.umd"
    },
    { name: "tslib", location: DEFAULT_WORKER_URL + "tslib", main: "tslib" }
  ]
} as any;‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

This tells the workers in the API where the workers should be loaded from. In this case, the CDN.

Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

רוןאברהם — Fri, 06 Dec 2019 09:53:47 GMT

Hello. I am facing the same issue. Just wondered if you managed to fix this, and How. Thanks in advance

Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

RyannGalea — Wed, 22 Jan 2020 10:59:07 GMT

I had to add this line:

{ name: "arcgis-js-api", location: `${DEFAULT_WORKER_URL}esri` }

To my loaderConfig packages as it was resolving the file at the wrong url.

Re: Error loading Pipeline.js - Angular & ArcGIS API For JavaScript

mfcallahan — Thu, 23 Jan 2020 20:19:42 GMT

Thanks, adding a similar configuration to my project looks like it would resolve the path issue I was seeing. I ultimately abandoned moving my the project to the arcgis-webpack-plugin, but I will likely refer back to your answer in the near future with other projects. Thanks for taking the time to help!