반응형
SMALL
Webpack
-
CRA 없이 React 설정하기 2프론트엔드 2023. 5. 22. 18:29
이번 글은 저번 CRA 없이 React 설정하기 1의 react 기본 설정과 eslint, prettier 도입 이후 webpack과 babel을 설정하는 과정을 작성할 예정입니다. 이번 글의 목표는 react 앱에 webpack과 babel을 적용시키는 것입니다. 각 옵션들이 필요한 이유와 목적 등을 이해하면서 글을 작성해보도록 하겠습니다. webpack과 babel을 사용하는 이유 webpack은 프로젝트 번들러로 프로젝트에 필요한 자원들을 합쳐주는 역할을 합니다. 여러 개로 나누어진 파일들을 하나로 합쳐줌으로써 네트워크 비용을 줄여줍니다. babel은 트랜스파일링 도구로 최신의 자바스크립트 문법을 오래된 브라우저가 이해할 수 있도록 오래된 문법으로 변환해주는 역할을 합니다. 모든 브라우저에서 호환 ..