인프런 커뮤니티 질문&답변
작성한 질문수
babel-loader 궁금증
작성
·
206
1
강사님 안녕하세요.
강의 구매 후, 처음으로 질문을 하나 남겨 봅니다.
요즘 리액트로 개발을 해보고 있는데 웹팩에서 babel-loader 가 transfile 을 수행한다는 걸 강의로 알게됐네요.
리액트로 로컬환경에서 npm run start 로 서버 띄어놓고 개발을 하면, 소스 수정할 때마다 자동컴파일이 진행되던데요.
아마 이때 babel-loader 가 transfile 를 하는 듯 한데요.
소스파일의 갯수가 늘어날수록 이 compile 속도가 점점 늘어나는 것 같습니다.
혹시 소스파일이 늘어나도 Compile 속도를 빠르게 유지할 수 있는 웹팩 설정 같은데 있을까요?
이런 문제를 부딪혀보고 해결해보신 적이 있으신지 너무 궁금합니다.
답변 2
0
강사님 안녕하세요.
Vite 같은 노번들 도구를 알려주셔서, 로컬개발환경만 Vite 로 테스트를 해보고 있습니다.
말씀해주신대로, Vite 를 사용하니 서버가 바로 Start 되는 장점이 있고
소스 일부만 수정했을 떄도 빠르게 확인해볼 수 있어서 개발생산성에 도움이 되는 것 같습니다.
그런데 노번들 도구라서 그런지, 서버 올리고 localhost:3000 을 접속하면
Webpack compile 시에는 개발자도구의 네트웍 탭에서 Request 갯수가 많지 않았는데
Vite 의 경우는 2000개 이상의 Request 가 발생하여, 테스트를 위해 첫페이지가 로드되기까지는
다소 시간이 걸리더라구요.
노번들도구의 특성상, 이부분은 좀 감수해야하는 부분일까요?
0
안녕하세요 아리마님, 좋은 질문 주셨네요. 웹팩 번들 사이즈가 커지면 파일들을 번들링하기 위한 시간이 자연스레 증가합니다. 이건 웹팩의 내부 메커니즘이 그렇기 때문에 어쩔 수 없는 거구요. 해당 문제를 해결하기 위해서 노 번들 도구들도 최근에 많이 나와 있으니 한번 참고해 보시면 좋을 것 같아요 :)
결국, 시스템의 규모가 커져서 모듈이 점점 늘어나는 상황에서는 웹팩을 포기하고 Vite 와 같은 도구를 검토하는 것이 현명할 수 있다라는 말씀이시군요. 강사님 통해서 웹팩을 공부하고나니 또 추가로 공부할 꺼리가 생겨버렸네요 ㅎㅎ
힌트를 주셔서 감사드립니다.