I have a project like this:
root/
webpack-config.js
app/
app.js
js/
dep.js
core/
module.js
Here is the webpack config file:
module.exports = {
entry: './app/app.js',
output: {
path: __dirname,
filename: "[name]-bundle.js"
},
module: {
loaders: [
{ test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ }
]
},
resolve: {
modulesDirectories: ['core']
}
...
in app.js, I have:
import local_dep from './js/dep';
import myModule from 'module';
This works as expected with webpack 1.x, but the myModule module isn't resolved with webpack 2, I'm getting "Module not found: can't resolve 'module' in ... \app".
It seems the modulesDirectories entry is ignored and the base URL corresponds to the entry's folder.
What can I do to make modules resolve correctly with webpack 2 ?
from: http://moduscreate.com/webpack-2-tree-shaking-configuration/
In Webpack 2, resolvers from root
, modulesDirectories
, and fallback
settings will merge into a single property – modules
. Here is how we can resolve file and module locations in Webpack 2:
resolve: {
modules: [
path.resolve('./client'),
'node_modules'
]
},
You can specify a number of directories in modules
, but make sure not to forget node_modules
or npm package dependencies will fail to load.
So in your case what was before:
resolve: {
modulesDirectories: ['core']
}
now needs to be
resolve: {
modules: ['core'] // also 'node_modules'
}
Edit: As others have noted, for Webpack 2, something like this works:
{
resolve: {
extensions: ['.js', '.jsx'],
modules: ['node_modules', path.resolve(__dirname, 'core')]
},
}
For Webpack 1, I have a setup that has this entry:
config.resolve = {
// Allows us to include js and jsx files without specifying the extension
extensions: ['', '.jsx', '.js'],
root: [path.resolve('./core')]
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With