studyHard
article thumbnail
Webpack과 Babel
개발 지식 2023. 8. 10. 15:34

리액트를 사용해서 개발을 하면 npm build 입력으로 빌드가 완료됩니다. create-react-app은 개발 환경부터 빌드까지 모든 것이 다 갖추어져 있습니다. 하지만 프론트엔드 개발자라면 그 뒷단의 이야기에 대해 알 필요가 있습니다. 자신의 프로젝트를 온전히 커스터마이징 하고 싶다면 CRA를 이용하지 않고 환경 설정부터 빌드 세팅까지 스스로 해야 합니다. 웹팩(Webpack) 웹팩은 오픈 소스 자바스크립트 모듈 번들러입니다. 말 그대로 여러 개의 파일을 하나의 파일로 모아주는 역할을 합니다. 여러 개의 파일을 하나로 모아주는 것은 왜 필요할까요? 이전에 모듈 번들러가 없을 때는 HTML에 모든 스크립트 파일을 불러왔어야 했습니다. 그러다 ES2015부터 모듈 시스템이 등장하여 exports로 모듈..