Angular Service Worker - несоответствие хэша после PurifyCSS на dist/styles.*. Css
Когда я создаю приложение Angular с помощью сервис-воркера, он создает хеш-таблицу с хешем каждого файла, чтобы определить, когда доступна новая версия приложения. Эта хеш-таблица находится в ngsw.json.
Вот пример хеш-значений.
Если я хочу очистить неиспользуемый css с помощью PurifyCSS, тогда dist / styles.*. Css изменит содержимое файла и, следовательно, его хеш, но ngsw.json имеет старый хеш.
В этой ситуации сервис-воркер angular завершится ошибкой из-за несоответствия хэша.
Как мне избежать этой ситуации? Следует ли мне вручную обновлять хеш в ngsw.json после запуска PurifyCSS? Есть ли какой-то механизм для автоматического обновления этого значения или PurifyCSS может быть запущен до того, как angular-cli сгенерирует хеш для каждого файла?
Этот вопрос в целом ориентирован на любые модификации файлов dist, кэшированных сервис-воркером, потому что хеш будет изменяться, и, следовательно, будет несоответствие хешей. Это означает, что сервис-воркер не будет работать.
Заранее спасибо.
2 ответа
Я обнаружил кое-что очень полезное, что есть в официальной документации Angular. Вы можете воссоздать файл ngsw.json с помощью простой команды после внесения всех необходимых изменений в файлы в папке dist.
./node_modules/.bin/ngsw-config ./dist/<project-name> ./ngsw-config.json [/base/href]
Это регенерирует ngsw.json, и сервисный работник снова работает правильно.
Я только что столкнулся с этой проблемой со своим Angular Service Worker. Я узнал об этом на собственном горьком опыте (забавный факт: NGSW не работает в автономном режиме и не кэширует результаты).
Во всяком случае, вот как я решил эту проблему.
Поскольку Angular встраивает CSS компонентов в выходные данные.js dist, автономный файл.css, выводимый Angular, содержит любые глобальные стили (т.е. styles.css) и, например, Bootstrap CSS. Я запустил purifyCSS и скопировал очищенный вывод вsrc/styles.css. Таким образом, вам не нужно вносить какие-либо модификации хэша SHA1 вngsw.jsonпосле постройки. Недостатком является то, что всякий раз, когда вы добавляете, скажем, модуль, который полагается на разные селекторы Bootstrap, вам нужно будет повторить этот процесс.
К сожалению, это немного неуклюже, но я не нашел способа интегрировать процесс очистки в процесс "предварительной сборки".