I'm migrating an existing website that uses requirejs over to webpack. I thought I would be able to replace the requirejs config with webpack.config.js and be done with it. However, webpack isn't including any of the dependencies required by any AMD modules. All of my modules are of the form:
define(require => {
const dep1 = require('models/dep1');
const dep2 = require('models/dep2');
...
const Utils = {
function doStuff() {
...
},
};
return Utils;
});
Here's a simplified version of my webpack config:
const webpack = require('webpack');
const sourcePath = __dirname;
const outputPath = './dist';
module.exports = (env) => {
return {
context: sourcePath,
entry: {
app: './src/index.js',
},
output: {
path: outputPath,
filename: '[name].bundle.js',
chunkFilename: '[id].[chunkhash].js',
},
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: [
'babel-loader',
],
},
],
},
};
};
And my .babelrc:
{
"presets": [
["babel-preset-env", {
"targets": {
"browsers": [
"last 2 Chrome versions",
"last 2 Firefox versions"
]
},
"modules": false
}],
"react"
],
}
If I remove the define wrapper from the file and replace the require statements with import statements, then it figures out how to include the dependencies in the bundle.
Is there an extra configuration I need in order to make webpack include the dependencies in the bundle? Is it possible webpack doesn't understand the arrow function style of the define define(require =>
as opposed to define(function(require) {
?