我正在从头开始使用 webpack4 做一个项目。但是当我尝试在 HTML 文件中显示图像时,我遇到了一个奇怪的问题:
后npm run build
,图像标签的src构建为<image src="[object Module]"
。
HTML 部分是:
<img src="images/main_background.jpg">
The webpack.config.js
这是 :
// ignore ...
{
test: /\.html$/,
use: [
{loader: 'html-loader'}
]
},
{
test: /\.(jpeg|jpg|png)$/,
use: [
'file-loader'
]
}
以及这两个加载器的版本:
"file-loader": "^5.0.2",
"html-loader": "^0.5.5",
我无法弄清楚问题是什么......
尝试添加esModule: false
文件加载器的选项如下:
...
{
test: /\.(jpeg|jpg|png)$/,
use: [
loader: 'file-loader',
options: {
esModule: false
}
]
}
...
这同样适用于 url-loader。
esModule 选项已在版本 4.3.0 的文件加载器中引入,在 5.0.0 中它已默认设置为 true,这可能是一个重大更改。
Sources:
- 文件加载器发布历史 https://github.com/webpack-contrib/file-loader/releases
- 相关的github问题 https://github.com/webpack-contrib/file-loader/issues/338
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)