如何使Webpack使用缓存后缀？ [英] How Can I Make Webpack Use a Cache-Busting Suffix?

问题描述

在Webpack之前，我总是依赖以下模式进行缓存清除：

Before Webpack I would always rely on the following pattern for "cache-busting":

<script src="foo.js?cacheBust=12345" />

其中 12345 是服务器生成的令牌对于我来说，每次构建（它可能是一个Git哈希，虽然在我的情况下它不是）。

where 12345 was a token the sever generated for me on every build (it could be a Git hash, although in my case it isn't).

使用Webpack我现在有两个文件： build.js 和 chunk.1.js 。由于我使用正常的脚本标记带来了第一个，我可以使用上面的模式：

With Webpack I now have two files: build.js and chunk.1.js. Since I bring the first one in with a normal script tag I can use the above pattern:

<script src="build.js?cacheBust=12345" />

但是，此时 build.js 去取得 chunk.1.js ，当它发生时它不包括缓存破坏后缀。

However, at that point build.js goes and fetches chunk.1.js, and when it does it doesn't include the cache-busting suffix.

我想让Webpack自动附加？cacheBust = 12345 ，但我不知道 12345 部分在构建时，所以我不能将它包含在我的 webpack.config 中。相反，我必须等到评估HTML页面，此时我从服务器获取令牌。

I would like for Webpack to automatically append the ?cacheBust=12345, but I don't know the 12345 part at build time, so I can't include it in my webpack.config. Instead, I have to wait until the HTML page is evaluated, at which point I get the token from the server.

所以，我的问题是，有什么方法可以让Webpack查看用于获取初始文件的参数（例如？cacheBust = 12345 ）并在获取其他文件时附加相同的参数？

So, my question is, is there any way to have Webpack look at the parameter used to fetch the initial file (eg. ?cacheBust=12345) and append that same parameter when fetching other files?

推荐答案

你可以这样做

output: {
    filename: '[name].js?t=' + new Date().getTime(),
    chunkFilename: '[name]-chunk.js?t=' + new Date().getTime(),
    publicPath: './',
    path: path.resolve(__dirname, 'deploymentPackage')
}

这篇关于如何使Webpack使用缓存后缀？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！