Почему при build сборке vue приложения все равно кешируются файлы, хотя они каждый раз разбиваются на chanks с рандомными префиксами
При сборке vue приложеня npm run build в продакшн менеджеры все равно не видят изменений пока не сбросят кеш, как избавиться от этого? Единственный файл, чье имя не изменяется - точка входа - index.html Может ли из-за одного него так происходить?
Ответы (2 шт):
Скорей всего им приходит старый index.html с ссылками на старые скрипты
На одном из проектов где актуальность кода была критична. При сборке создавалось 2 файла с ключом последнего коммита сборки
- build_version.js - в нём была константа с id коммита и он был в сборке
- tag.json - так же содержал id коммита при сборке, лежал в папке приложения. При запуске сайт делал запрос к tag.json с хедером (Cache-Control: no-cache, no-store) и сравнивал её с константой в сборке. При отличии просил обновить страницу
Задачу сброса кэша при каждой новой сборке можно решать так.
Суть подхода:
- vue-ssr с использованием шаблона.
- Использование актуальной даты как query-параметр для сброса кэша.
- Передача параметра даты с помощью node.js
Этот метод потребует прокидывания переменных в шаблон. Так же можно использовать только webpack-плагины для этого, чтобы вставлять актуальную дату в шаблон и тогда кэш будет сбрасываться автоматически.
В коде шаблона html - path-to-build-folder/main.js?date={{calc_date}}. Это приведет к сбросу кэша при каждой новой сборке.
calc_date можно передавать с помощью node.js
output: {
path: 'path',
filename: '[name].js',
publicPath: '/public/build/',
chunkFilename: '[id]_[contenthash].js',
},
Если использовать чанки для файлов - перезагрузится в итоге точка входа, часть чанков останется закэшированной, новые - будут подгружены.