Esri / ember-esri-loader

An Ember addon to allow lazy loading the ArcGIS API for JavaScript in Ember applications
http://ember-esri-loader.surge.sh/
MIT License
11 stars 6 forks source link

Incompatible with ember-auto-import 2.x #114

Closed timmorey closed 2 years ago

timmorey commented 2 years ago

We have recently tried updating to ember-auto-import 2.x, and found that this addon is not compatible with it.

In ember-auto-import 1.x, modules got injected into vendor.js or test-support.js. These files then later got rewritten by ember-esri-loader to replace require and define, and everything worked.

In ember-auto-import 2.x, modules are getting placed in external js files (chunk.*.js files), which are then loaded via <script> tags in index.html. This addon is failing to replace require and define in these chunk files, since it is hard-coded to only consider a few files (see https://github.com/Esri/ember-esri-loader/blob/a59b32e5456932dc5c8b3de23ce35c3cce537474/index.js#L82-L88).

One of the new chunk files, which is named /assets/chunk.app.[some-hash].js by default, attempts to capture require and define from the app (see https://github.com/ef4/ember-auto-import/blob/main/packages/ember-auto-import/ts/webpack.ts#L69-L79). This file is currently not getting rewritten by this addon, resulting in an error like Uncaught ReferenceError: require is not defined at runtime.

I was able to work around this problem by hacking the webpack configuration passed to ember-auto-import:

autoImport: {
  webpack: {
    output: {
      filename: 'my-app.chunk.[id].[chunkhash].js',
    },
  },
},

With this change, the file that captures require and define satisfies the regex at https://github.com/Esri/ember-esri-loader/blob/a59b32e5456932dc5c8b3de23ce35c3cce537474/index.js#L83, so it gets rewritten.

While this works, I think we could probably better support ember-auto-import 2.x in this addon. One simple option might be to expose an option that allows the user to identify more files that should be processd by this addon. For example, a user could include something like this in ember-cli-build.js:

'ember-esri-loader': {
  additionalFiles: [ /chunk\..*\.js/ ],
}
tomwayson commented 2 years ago

This has been released in 4.1.0