Migrating from requirejs to webpack

Question

I'm migrating/moving a project based on require.js to webpack v3. Since all my modules are using the following syntax:

    define([modules,..], function(mod1,..) 

Which declares which modules to use, and assigns the modules to the variables in the anonymous function. This seems to be deprecated since v2 of webpack. I can't find any information about this (except for the documentation for web pack v1).

Should I rewrite all my modules to the commonjs (including dependencies) or are there any smart way to use the AMD modules?

Help much appreciated :-) Regards

Answer 1

AMD never found much use outside of requirejs so likely you will need to convert. There are tools that will help:

• https://github.com/anodynos/uRequire can convert code from AMD -> UMD / CommonJS

There are caveats from (https://github.com/anodynos/uRequire/wiki/nodejs-Template):

• Runtime translation of paths like models/PersonModel to ../../models/PersonModel, depending on where it was called from. You 'll still get build-time translated bundleRelative paths, to their nodejs fileRelative equivalent.

For most projects this is not an issue.

• Can't use the asynchronous version of require(['dep'], function(dep){...})

You should be able to use the synchronous version of require. If using webpack2 you can use System.import or require.ensure

• Can't run requirejs loader plugins, like text!... or json!...

You will find webpack version of all of these plugins

• There's no mapping of /, ie webRootMap etc or using the requirejs.config's {baseUrl:"...."} or {paths:"lib":"../../lib"}

This can be replicated with https://www.npmjs.com/package/babel-plugin-module-alias