我有一个使用Service Worker的Web应用程序来预取和缓存所有资产。因此,我需要一个缓存键,该键在您的资产运行时会发生变化,例如与我的资产一起的块的哈希。但是,我很难将哈希值放入Service Worker的模板中。
这是我的webpack.config.js
的简化版本:
const extractSW = new ExtractTextPlugin('serviceworker.js');
module.exports = {
entry: {
main: ['./scripts/main.js'],
serviceworker: ['./templates/serviceworker.js']
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'static')
},
module: {
rules: [
{
resource: path.resolve(__dirname, 'templates', 'serviceworker.js'),
loader: extractSW.extract({
use: [
{
loader: 'apply-loader',
options: {obj: {hash: <hash>}}
},
{
loader: 'underscore-template-loader'
}
]
})
}
]
},
plugins: [extractSW, new UglifyJSPlugin()]
};
如何使
<hash>
作为main
块的哈希? 最佳答案
我建议使用一个Webpack插件来为您处理所有复杂的缓存版本控制,例如WorkboxWebpackPlugin
(我正在研究)或offline-plugin
。
一方面,您将最终能够在更精细的级别上缓存文件,并且仅重新下载实际更改的文件(而不是在main
块的哈希值更改时重新下载所有内容)。
关于javascript - 使用webpack获取不同块的哈希(进入Service Worker),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47322288/