webpack打包资源版本管理
webpack引入version-manage-webpack-plugin，提供打包资源的版本管理能力，实现非覆盖式发布。
覆盖式发布
打包时输出的新版本资源直接覆盖了旧资源，发布到服务器后，导致了：
正在使用的用户访问其他页面时，请求旧版本资源出现了
404，此时必须通过刷新浏览器才能正常使用。发版后出现致命bug，无法快速回滚为旧版，只能通过git回滚代码重新发版。
原理
构建时保留旧版本资源。记录package.json的version和本次打包生成的资源目录的映射关系，生成version-manage.json文件，实现对各个版本的资源管理。
功能
版本与资源目录管理。（
dist/version-manage.json）旧版本恢复。
版本修订号自增加。
清除过期版本（记录，资源文件）。
控制台打印版本号。
安装
npm i --save-dev version-manage-webpack-plugin 复制代码
yarn add --dev version-manage-webpack-plugin 复制代码
用法
const VersionManageWebpackPlugin = require('version-manage-webpack-plugin') module.exports = { //... plugins: [ // 添加到结尾处 new VersionManageWebpackPlugin() ] } 复制代码参数
| 字段 | 类型 | 默认值 | 描述 |
|---|---|---|---|
entryFileName | {String} | index.html | Html入口文件 |
autoIncVersion | {Boolean} | false | 版本修订号是否自增加 |
indent | {Number} | 2 | 代码缩进，修改package.json文件时使用 |
maxAge | {Number} | 0 | 版本最大存储周期（秒）。始终保留上一个版本 |
log | {Boolean} | false | 访问时，控制台打印当前版本号 |
提示
通过手动修改
package.json版本号恢复旧版本。生产环境构建时使用。
关闭脚手架构建前清除打包目录功能。
构建
设置package.json的version，指定本次版本号1.0.0。
回滚版本
设置package.json的version，指定需要回滚的版本号1.0.0。
清除旧版本
设置maxAge参数，构建时清除过期版本，注：始终保留上一个版本。
new VersionManageWebpackPlugin({ maxAge: '24 * 60 * 60', // 过期时间为一天 }) 复制代码
作者：doc
链接：https://juejin.cn/post/7019222347777310728