CODEWITHSUNDEEP
dynamicimportwebpackloader
Santos
Santos

Reputation: 434

webpack script-loader with dynamic import

webpack.config.js

  resolve: {
    modules: ['node_modules', 'src/client'],
    alias: {
      node_modules: process.cwd() + '/node_modules',
      ace: 'node_modules/ace/build/src'
    }
  }

This works:

import 'script-loader!ace/ace';
import 'script-loader!ace/theme-monokai';
import 'script-loader!ace/worker-javascript';
import 'script-loader!ace/mode-javascript';

But with the following code I receive a error:

Promise.all([
    import('script-loader!ace/ace');
    import('script-loader!ace/theme-monokai');
    import('script-loader!ace/worker-javascript');
    import('script-loader!ace/mode-javascript');
])

[Script Loader] ReferenceError: define is not defined

I think the script-loader don't have the same behaviour with dynamic imports !? or maybe I'm doing something wrong :(

Upvotes: 1

Views: 767

Answers (1)

Santos
Santos

Reputation: 434

If I add this to my webpack.config.js works...

module: {
  rules: [{
    test: [
      process.cwd() + '/node_modules/ace/build/src/ace',
      process.cwd() + '/node_modules/ace/build/src/theme-monokai',
      process.cwd() + '/node_modules/ace/build/src/mode-json'
    ],
    loader: 'script-loader'
  }]
},

resolve: {
  modules: ['node_modules'],
  alias: {
    node_modules: process.cwd() + '/node_modules',
    ace: 'node_modules/ace/build/src'
  }
}

and after in the code I can just:

Promise.all([
  import('ace/ace'),
  import('ace/theme-monokai'),
  import('ace/mode-javascript')
])

Upvotes: 1

Related Questions