vue项目 npm run build 打包项目时为css、js文件加时间戳版本号，防止浏览器缓存

最新推荐文章于 2024-06-12 17:26:50 发布

chinahcp2008

最新推荐文章于 2024-06-12 17:26:50 发布

阅读量3.3k

点赞数 1

分类专栏： vue JavaScript uniapp 文章标签： javascript 前端 typescript

本文链接：https://blog.csdn.net/chinahcp2008/article/details/124303596

版权

vue 同时被 3 个专栏收录

15 篇文章 1 订阅

订阅专栏

JavaScript

15 篇文章 0 订阅

订阅专栏

uniapp

2 篇文章 0 订阅

订阅专栏

在Vue项目中，通过vue.config.js配置Webpack，在生产环境中为JS和CSS文件添加动态时间戳，确保每次构建文件名不同，从而实现缓存刷新。配置包括修改output.filename和output.chunkFilename以包含当前时间。

摘要由CSDN通过智能技术生成

在vue.config.js文件中做如下配置

const Timestamp = new Date().getTime()

module.exports = {
	configureWebpack: config => {
		if (process.env.NODE_ENV === 'production') {
			config.output.filename = `js/[name].${Timestamp}.js`
			config.output.chunkFilename = `js/[name].${Timestamp}.js`
		}
	},
	
	css: {
		extract: {
			filename: `css/[name].${Timestamp}.css`,
			chunkFilename: `css/[name].${Timestamp}.css`
		}
	}
}