我在html里面使用img,然后通过file-loader,html-withimg-loader,html-webpack-plugin去打包
html代码
Document
webpack.config.js
'use strict';
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: './src/index.js',
output: {
path: path.join(__dirname, 'dist'),
filename: '[name]_[contentHash:8].js'
},
mode: 'production',
stats: { children: false },
module: {
rules: [
{
test: /\.js$/,
use: 'babel-loader'
},
{
test: /\.css$/,
use: [
'style-loader',
'css-loader',
]
},
{
test: /\.(png|svg|jpg|gif)$/,
use: ["file-loader"]
},
{
test: /\.html$/,
use: ["html-withimg-loader"]
},
]
},
plugins: [
new HtmlWebpackPlugin({
template: path.join(__dirname, 'src/index.html'),
filename: 'index.html',
chunks: '[index]',
inject: true,
minify: {
html5: true,
collapseWhitespace: true,
preserveLineBreaks: false,
minifyCSS: true,
minifyJS: true,
removeComments: false
}
}),
],
};
图片有打包成功,但是有报错,html生成错误
版本webapck:4.41.2,file-loader:5.0.2,html-withimg-loader:0.1.16,html-webpack-plugin:3.2.0