더북(TheBook)

하위 폴더 여부와 상관없이 항상 경로를 환경변수로 추가할 수도 있다. 다음 셸 구문은 PATH 환경변수와 프로파일에 항상 ./node_modules/.bin을 추가한다.

export PATH="./node_modules/.bin:$PATH"

 

보너스: 이렇게 설정하면 경로를 입력하지 않고도 지역에 설치한 npm CLI 도구라면 무엇이든 실행할 수 있다.

Tip

Babel 설정을 마친 package.json 파일의 예는 이 책의 예제 코드 중 ch03 폴더의 프로젝트에서 확인할 수 있다. 앞으로 이어지는 장에서도 이와 같은 방식으로 작성한다. ch03 폴더의 package.json 파일을 살펴보면 컴파일을 거쳐야 하는 하위 폴더의 프로젝트를 대상으로 scripts 항목에 명령을 작성했다. 다만 프로젝트 폴더에 자체적으로 package.json 파일이 있는 경우에는 프로젝트 폴더의 package.json 파일에 명령이 작성되어 있을 수도 있다.

 

npm run build-hello-world처럼 빌드 명령을 실행하면 ch03/PROJECT_NAME/jsx 폴더에 위치한 JSX 파일을 일반 자바스크립트 파일로 변환하여 ch03/PROJECT_NAME/js에 저장한다. 따라서 npm i 명령으로 필요한 의존성을 설치하고(ch03/node_modules 폴더가 생성된다), package.json에 빌드 명령이 있는지 확인한 후 해당 명령을 npm run build-PROJECT_NAME으로 실행하기만 하면 된다.

지금까지 JSX 파일을 일반 자바스크립트 파일로 변환하는 가장 쉬운 방법을 살펴보았다. 이어서 React와 JSX의 까다로운 부분에 대해서 살펴보자.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.