我想在我的js文件名中添加一个哈希来执行缓存破坏。 我在互联网上读过很多文章，但我不知道在哪里添加 [hash] 元素。不知道从哪里开始。
这在我的 webpack.config 文件下面。
const devCerts = require("office-addin-dev-certs");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const fs = require("fs");
const webpack = require("webpack");
module.exports = async (env, options) => {
const dev = options.mode === "development";
const config = {
devtool: "source-map",
entry: {
polyfill: "@babel/polyfill",
jquery: "jquery/src/jquery",
taskpane: "./src/taskpane.ts",
sentry: "@sentry/browser"
},
resolve: {
extensions: [".ts", ".tsx", ".html", ".js"]
},
module: {
rules: [
{
test: /.ts$/,
exclude: /node_modules/,
use: "babel-loader"
},
{
test: /.tsx?$/,
exclude: /node_modules/,
use: "ts-loader"
},
{
test: /.html$/,
exclude: /node_modules/,
use: "html-loader"
},
{
test: /.(png|jpg|jpeg|gif)$/,
use: "file-loader"
}
]
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
filename: "taskpane.html",
template: "./src/taskpane.html",
chunks: ["polyfill", "jquery", "taskpane", "sentry"]
}),
new CopyWebpackPlugin([
{
to: "taskpane.css",
from: "./src/taskpane.css"
}
]),
new CopyWebpackPlugin([
{
to: "assets",
from: "./assets"
}
]),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery"
})
],
devServer: {
headers: {
"Access-Control-Allow-Origin": "*"
},
https: (options.https !== undefined) ? options.https : await devCerts.getHttpsServerOptions(),
port: process.env.npm_package_config_dev_server_port || 3000
}
};
return config;
};
在entry: { ... },后添加这个
output: {
filename: '[name].[hash].js', // or better [contenthash]
path: path.resolve(__dirname, 'dist'),
},
optimization: {
runtimeChunk: 'single',
},
假设您希望 Webpack 生产./dist子目录。