Vue.js

[Vue.js] 빌드시 js 파일 버저닝

임호랑이 2021. 8. 31. 10:11

 

 

배포를 위한 빌드시 수정한 js 파일이 캐시가 남아 변경이 안되는 경우가 발생하였다.

(이러한 경우를 cache busting 이라고한다 맞나?)

구글링을 해본결과 다양한 방법중

webPack 을 이용한 js 버저닝 하는 방법이 있었다.

 

vue.config.js 에서 아래와 같이 설정해주면 된다

module.exports = {
	
	configureWebpack: config => {
			if (
				process.env.NODE_ENV === 'production' ||
				process.env.NODE_ENV === 'development'
			   ) {	
				config.output.filename = 'js/[name].[hash].js';
				config.output.chunkFilename = 'js/[name].[hash].js';
			}
		}
        
    }

나같은 경우 producting(운영) OR development(테스트) 배포시에 빌드되는 js 파일에
이름뒤에 [hash]를 붙혀서 난수? 만들듯이 이전과 다른 이름값으로 설정했다.

Easy~~