webpack caching 설정하기

output: {

    path: path.resolve(__dirname, 'dist'),

    // filename: 'main.js'

    filename: '[name].[contenthash].js',    // 이렇게 파일이름 설정하면 내용 변경이 있을 때, 파일이름 다른걸로 생성해줌

    clean: true,                            // npm run build 했을 때, 기존 파일들 없애줌, 안넣으면 파일 계속 생김

  },

output 이렇게 작성해주면 됨

 

원래대로 하면

npm run bulid 했을 때,

dist 폴더에 main.js 가 생김

다시 build 해도 main.js 임

내용 안바뀌어도 컴퓨터가 파일 계속 다시 만듦

 

근데 [name].[contenthash].js 이렇게 해놓으면

main.어쩌구저쩌구.js가 나옴

index.html에 script태그에 있는 애도 알아서 바뀜

 <script defer="defer" src="main.e91d0c47f9d50a3d83eb.js"></script>

근데 빌드할 때 내용이 바뀌면 파일 계속 생김

그때 clean: true 추가해주고 빌드하면 마지막 파일 1개만 남음