在webpack.config.js做了少许更改后,运行webpack命令,突然出现以下错误:
ERROR in Entry module not found:
Error: Cannot resolve 'file' or 'directory'
./es6/index.es6 in E:\Workspace\webpack-template
然而反复对比了目录结构,发现“es6/index.es6”就在“E:\Workspace\webpack-template”,但为什么始终找不到呢?试着引入path,将入口文件改为绝对地址,如下:
let path = require('path')
module.exports = {
entry: {
index: path.resolve('./es6/index.es6')
}
}
但依旧报同样的错误,“ERROR in Entry module not found”。
按配置逐项排除,最后发现竟然跟resolve配置项相关,覆盖默认配置后,必须在extensions中添加空字符串,如下:
resolve: {
// 第一项空字符串必不可少,否则报模块错误
extensions: ['', '.es6']
}
为什么会这样呢?官方的解释如下:
Using this will override the default array, meaning that webpack will no longer try to resolve modules using the default extensions.
For modules that are imported with their extension, e.g. import SomeFile from "./somefile.ext", to be properly resolved, an empty string must be included in the array.
简单说起来,就是如果覆盖了默认的配置,就必须添加空字符串。
本文讲述了在使用Webpack构建项目过程中遇到的模块解析问题及解决方法。当覆盖默认配置时,需在extensions数组中添加空字符串来确保正确解析带有扩展名的模块。

696

被折叠的 条评论
为什么被折叠?



