빌드

»

빌드

웹사이트 구성요소를 각 파일로 분리하는 모듈화가 이뤄짐에 따라 모듈을 하나로 묶어주는 번들링 이 필요해지게 됬다

그와중에 소프트웨어 빌드 라는 소스코드를 실행 가능한 결과물로 변환하는 작업도 생기게 된다

%E1%84%87%E1%85%B5%E1%86%AF%E1%84%83%E1%85%B3%20f4d9bd1e3599467ebfdf50f10eb78f78/Untitled.png

npm build 는 모듈을 정적인 파일로 만들어줍니다

주요 빌드 툴

React 에는 다양한 생성 툴이 있는데 대표적으로는 Create React AppNext.js 가 있습니다

우리가 아는 Create ReactApp에는 react-scripts 라는 모듈이 사용되고 있습니다

빌드 툴

프로젝트 생성 툴의 구성을 조금 더 살펴보면, 내부적으로 다양한 툴의 조합으로 이뤄져있는데, 이러한 툴은 다음과 같은 것들이 있습니다.

  • webpack: 모듈 번들러
  • babel: TypeScript, JSX 등과 같이 브라우저가 지원하지 않는 언어를 JavaScript로 바꿔주는 컴파일러
  • ESLint: 자바스크립트 Code convention 및 문법 검사기
  • Sass, less: CSS Preprocessor

%E1%84%87%E1%85%B5%E1%86%AF%E1%84%83%E1%85%B3%20f4d9bd1e3599467ebfdf50f10eb78f78/Untitled%201.png