본문 바로가기
📌 Front End/└ Node.js

[Node.js] Package.json 명령어 npm start, npm run build 스크립트 차이점

by 쫄리_ 2024. 8. 9.
728x90
반응형

package.json 파일 실행 스크립트

start, build, test, eject 4가지 명령이 있습니디. 

일반적으로 start는 개발 모드 build는 배포용 빌드라고 알고 있습니다. 

  • npm start
  • npm run build
  • npm test
  • npm run eject
"scripts": {
  "start": "react-scripts start",
  "build": "react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
},

 


npm start

개발 모드로 프로그램을 실행하는 명령어 입니다.
HMR(hot-module-replacement)가 동작해 수정과 동시에 화면이 변경됩니다.
개발 모드에서 코드에 에러거 있을 경우에는 브라우저에 메시지를 출력합니다.
https 실행 옵션을 통해 https 인증서 없이 임시로 https 형태로 url을 만들 수 있습니다.

 

📌 실행 코드

npm start

 

📌 https 실행 옵션 사용해서 실행

// ▶ macOS
HTTPS=true npm start

// ▶ Windows
set HTTPS=true && npm start

 


npm run build

배포 환경에서 사용할 파일을 만들어준다.
압축 형태로 제공

 

📌 실행 코드

npm run build

 

📌 정적 파일 서비스 실행

serve 패키지는 노드(node.js) 환경에서 동작하는 웹 서버 애플리케이션 입니다. 

npx 로 실행하며 build 된 정적 파일을 서비스 할 때 간단하게 사용하기 편리합니다.

npx serve -s build

 


npm test

테스트 코드를 실행합니다.
create-react-app 에는 제스트(jest) 테스트 프레임워크가 기본 동작합니다.

 

📌 테스트 대상

        ●  __test__ 폴더에 밑에 있는 모든 자바스크립트 파일
        ●  파일 이름이 .test.js로 끝나는 파일
        ●  파일 이름이 .spec.js로 끝나는 파일

 

CI(continuous integration)와 같이 watch 모드가 필요 없는 환경에서는 다음 명령어로 테스트 코드를 실행합니다.

// ▶ macOS
CI=true npm test

// ▶ Windows
set "CI=true" && npm test

 


npm run eject

숨겨져 있던 create-react-app 내부 설정 파일의 노출합니다.
바벨이나 웹팩 설정을 변경할 수 있습니다. (단점은 익숙해야 가능)

 

npm run eject 외에도 방법이 존재합니다.
방법 1 : react-scripts 프로젝트를 포크(fork) 해서 나만의 스크립트를 만든다.
방법 2 : react-app-rewired 패키지를 사용한다.

 


728x90
반응형