개발자
안녕하세요. 젠킨스 + 깃헙 통해서 깃헙 훅으로 젠킨스에서 웹팩 자동빌드를 하고 있는데요. 어떤 소스가 어떤 output파일에 영향을 준건지 파일 리스트를 매 빌드때 뽑아 보고싶습니다. 혹시 마지막 빌드때 어떤 output파일이 바뀐건지 알 수 있는 방법이 있을까요? 추가로 다른 js들에서 거의 공통으로 import 하는 js 는 한번 수정하면 다른 js 들이 다 재빌드 되는느낌이던데 보통 이런 공통소스들은 다들 어떻게 관리하시는지 궁금합니다! 혹시 도움될만한 내용 아신다면 한번만 도움 부탁드립니다 ㅠ.ㅠ
답변 0
첫 답변을 기다리고 있어요.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
커리어리 AI 봇
GPT가 달아주는 답변입니다.
2023년 11월 16일
1. **Webpack output 파일 추적**: Webpack에서는 Stats Data를 제공합니다. 이는 웹팩이 모듈, 청크, 패키지 등을 어떻게 처리하는지에 대한 상세한 정보를 제공합니다. `webpack --json > stats.json` 커맨드로 웹팩 빌드의 결과에 대한 자세한 통계 데이터를 JSON 형식으로 얻을 수 있습니다. 그 후 이 JSON 파일을 분석해서 필요한 정보를 얻을 수 있습니다. 2. **공통으로 사용되는 JS 파일 관리**: 이 부분은 프로젝트의 규모와 구조에 따라 다르겠지만, 보통 공통 모듈이 많이 변경되면 재빌드가 자주 일어납니다. 이러한 재빌드가 너무 잦으면 성능 문제가 발생할 수 있습니다. 하나의 방법은 webpack의 splitChunks 플러그인을 사용하여 공통 모듈을 별도의 chunk로 분리하는 것입니다. 이렇게 하면 공통 모듈이 변경되었을 때 해당 chunk만 재빌드하므로 불필요한 재빌드를 줄일 수 있습니다. 또 다른 방법으로는 DLLPlugin과 DllReferencePlugin을 사용하여 공통 모듈들을 별도의 bundle로 만들고, 이 bundle은 자주 변경되지 않는다고 가정하고 별도로 관리하는 것입니다. 이렇게 하면 공통 모듈이 변경되었을 때 다른 bundle들을 재빌드할 필요가 없습니다. 그 외에도 코드 스플리팅, 트리 쉐이킹 등 많은 웹팩의 최적화 기법들이 있으니 상황에 맞게 적절히 조합하여 사용하시면 될 것 같습니다. 이런 정보들을 도움이 되셨으면 좋겠습니다! 더 궁금한 점이 있다면 언제든지 물어보세요.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!