我有一个这样的项目:
root/
webpack-config.js
app/
app.js
js/
dep.js
core/
module.js
这是webpack配置文件:
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']
}
...
在app.js中,我有:
import local_dep from './js/dep';
import myModule from 'module';
这与webpack 1.x一样正常,但myModule模块没有用webpack 2解决,我得到了"找不到模块:无法解决&#39 ;模块'在... \ app"。
似乎忽略modulesDirectories条目,基本URL对应于条目文件夹。
如何使用webpack 2正确解析模块?
答案 0 :(得分:12)
来自:http://moduscreate.com/webpack-2-tree-shaking-configuration/
在Webpack 2中,来自root
,modulesDirectories
和fallback
设置的解析器将合并为一个属性 - modules
。以下是我们如何在Webpack 2中解析文件和模块位置:
resolve: {
modules: [
path.resolve('./client'),
'node_modules'
]
},
您可以在modules
中指定多个目录,但请确保不要忘记node_modules
或npm包依赖项将无法加载。
所以在你的情况下,之前是:
resolve: {
modulesDirectories: ['core']
}
现在需要
resolve: {
modules: ['core'] // also 'node_modules'
}
答案 1 :(得分:4)
编辑:正如其他人所说,对于 Webpack 2 ,这样的事情可行:
{
resolve: {
extensions: ['.js', '.jsx'],
modules: ['node_modules', path.resolve(__dirname, 'core')]
},
}
对于 Webpack 1 ,我有一个具有此条目的设置:
config.resolve = {
// Allows us to include js and jsx files without specifying the extension
extensions: ['', '.jsx', '.js'],
root: [path.resolve('./core')]
};
答案 2 :(得分:-4)
感谢克里斯托弗戴维斯,我通过添加:
解决了这个问题resolveLoader: {
root: path.join(__dirname, 'node_modules')
},
resolve: {
root: ['./core']
}
我必须添加resolveLoader行,否则我收到有关无法加载的babel-loader的错误。