Я использую Angular (пользовательская процедура сборки Webpack) вместе с Workbox v.3.2.0 с workbox-webpack-plugin v.3.2.0 (плагин InjectManifest)в целях предварительного кэширования и испытывают трудности с пересмотром файла style.css , который создается extract-text-webpack-plugin .
Если я изменюсоответствующие файлы CSS, Webpack генерирует обновленный файл style.css , но его редакция не изменяется в манифесте предварительного кэша.
В результате я получаю файл, который не обновляется в кэше рабочего сервиса.
Вот соответствующие части конфигурации Webpack (полная конфигурация слишком велика):
{
entry: {
'polyfills': './src/polyfills.ts',
'main': AOT ? './src/main.browser.aot.ts' : './src/main.browser.ts',
'style': './src/main.scss'
},
resolve: {
extensions: ['.ts', '.js', 'json', '.scss', '.html'],
modules: [helpers.root('src'), helpers.root('node_modules')]
},
module: {
rules: [
...
{
test: /\.scss$/,
use: ExtractTextPlugin.extract(['css-loader?sourceMap', 'postcss-loader', 'sass-loader?sourceMap']),
exclude: [helpers.root('src', 'styles')]
},
...
]
},
plugins: [
...
new ExtractTextPlugin("[name].css"),
new InjectManifest({
swSrc: './service-worker.js',
include: [
/\.html$/,
/\.js$/,
/\.css$/,
/\.ico$/,
/\.json$/,
/\.png/,
/\.svg$/,
/\.gif$/,
/\.woff$/,
/\.ttf$/,
/\/workbox.*\/.*$/,
/css.*\.css$/,
/fonts.*\.(svg|eot|ttf|woff)$/,
/i18n.*\.json$/,
/img.*\.(svg|png|gif|jpeg|jpg)$/,
],
exclude: [
/poc\/.*$/,
/service-worker.js$/,
/icons-sprite/,
],
importWorkboxFrom: 'local',
}),
...
]
}
Обратите внимание, что я не могу использовать что-то вроде new ExtractTextPlugin("[name].[contenthash].css")
из-за некоторых проблем с кэшированием устаревшей версии index.html
ссылок на файлы из предыдущих выпусков (больше не существует).Вот почему мы используем URL-параметры анти-кэширования вместо встраивания ревизии в имя файла.
Для любого другого файла, сгенерированного Webpack, ревизия обновляется без каких-либо проблем (даже для ресурсов, в которые не встроена ревизия).в имя файла)
Может кто-нибудь помочь мне здесь?Спасибо:)