topic Re: Specifying webpack entry point for @arcgis/core npm library to bundle into DLL build in ArcGIS JavaScript Maps SDK Questions

Specifying webpack entry point for @arcgis/core npm library to bundle into DLL build

celliott — Thu, 22 Jun 2023 16:17:04 GMT

Hey all, I'm trying to create a DLL build with webpack that packages a number of npm dependencies so that they can be referenced within other webpack files. The issue I'm facing is that unlike some of the other dependencies, when I include @ArcGIS/core into the webpack.config.js entry vendor list and attempt to bundle it into the DLL build, I get errors that it cannot find a valid entry point/index.js file.

Is there a something similar to an index.js file that I can use to specify as an entry point for the @ArcGIS/core module, or is there a way I can do something similar by creating my own entry point?

For reference, this is all I'm doing in the webpack.config.js file right now:

module.exports = { mode: "development", cache: true, entry: { vendor: ["react", "@arcgis/core"] }, plugins: [ new webpack.DllPlugin({ context: __dirname, name: '[name]_[fullhash]', path: path.join(__dirname, 'dist', 'manifest.json') }) ] }

Re: Specifying webpack entry point for @arcgis/core npm library to bundle into DLL build

ReneRubalcava — Thu, 22 Jun 2023 18:19:22 GMT

I was never able to get the DLL plugin to work with webpack. It might require scripting out all the files in the package to add, but even then, I don't know if it will work correctly with workers and wasm. Module federation might be an easier route. If you find a way, I'd love to hear about it.

Re: Specifying webpack entry point for @arcgis/core npm library to bundle into DLL build

celliott — Thu, 22 Jun 2023 18:19:46 GMT

Will do, I'm still trying to experiment around with it. One thing I'm testing out is building my own entry point for @arcgis/core and I noticed if you add an entry point to an index.js file in the webpack.config.js, and in the index.js file you include a dynamic import with a template string for @ArcGIS/core like this, it can create a build of the entire dependency which is one step further:

const dependency = ''; import( /* webpackMode: "lazy-once" */ /* webpackExports: ["default", "named"] */ `@arcgis/core/${dependency}.js` ).then(() => {});

With dynamic imports using a template string, it looks like webpack has to include everything possible for that module in the build, but the downside here is the DLL plugin's generated manifest.json ends up generating invalid JSON. Seems like it doesn't like dynamic imports very much...