当我以监视模式运行Webpack(不使用开发服务器)时,一切都会在第一次正确构建,但是当我更改非HTML文件的任何代码时,由于该HTML文件不会被重建并没有更改,因此clean-webpack-plugin认为它是陈旧资产,并将其及其所有依赖项删除。我怎样才能解决这个问题?我必须摆脱clean-webpack-plugin吗?
我的webpack.config.js:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const {CleanWebpackPlugin} = require('clean-webpack-plugin');
const mode = process.env.NODE_ENV || 'development';
module.exports = {
mode,
watch: mode === 'development',
entry: {
popup: path.join(__dirname, 'src', 'ts', 'popup.ts')
},
module: {
rules: [
{
test: /\.tsx?$/,
use: ['ts-loader', 'eslint-loader'],
exclude: /node_modules/
},
{
test: /\.html$/,
loader: 'html-loader',
exclude: /node_modules/
},
{
test: /\.css$/i,
use: ['style-loader', 'css-loader'],
},
{
test: /\.(png|svg|jpg|gif)$/,
use: ['file-loader'],
}
]
},
devtool: 'inline-source-map',
resolve: {
extensions: ['.ts', '.js']
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
template: path.join(__dirname, 'src', 'popup.html'),
filename: 'popup.html',
chunks: ['popup'],
}),
new CopyWebpackPlugin({
patterns: [{
from: 'src/manifest.json',
transform: function(content) {
return Buffer.from(JSON.stringify({
description: process.env.npm_package_description,
version: process.env.npm_package_version,
...JSON.parse(content.toString())
}));
}
}]
})
],
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist')
}
};
如果您的index.html文件在每次重建中都没有重新生成(从上面的选项中看起来不像),则必须将setcleanStaleWebpackAssets
选项设置为false
clean-webpack-plugin。
new CleanWebpackPlugin({cleanStaleWebpackAssets:false})
https://github.com/johnagan/clean-webpack-plugin#options-and-defaults-optional
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句