NPM Scripts 사용법

NPM스크립트 보기 활용

NPM Scripts는 package.json 파일에 정의된 명령어들을 손쉽게 실행할 수 있는 방법입니다. JavaScript 프로젝트에서 자주 사용하는 명령어(빌드, 테스트, 시작 등)를 간단하게 관리할 수 있습니다. NPM Scripts를 사용하면 명령어를 외우거나 긴 명령어를 입력할 필요 없이, 짧은 명령으로 자동화된 작업을 실행할 수 있어 매우 유용합니다.

1. package.json 파일 확인

프로젝트의 루트 디렉토리에는 일반적으로 package.json 파일이 존재합니다. 이 파일에 NPM Scripts를 정의할 수 있습니다.

 

2. NPM Scripts 정의하기

package.json 파일에서 "scripts" 항목 아래에 명령어를 정의할 수 있습니다. 다음은 예시입니다:

{
  "name": "my-project",
  "version": "1.0.0",
  "scripts": {
    "start": "node app.js",
    "build": "webpack --config webpack.config.js",
    "test": "jest",
    "lint": "eslint .",
    "dev": "nodemon app.js"
  }
}

위에서, "scripts" 항목에는 다양한 스크립트가 정의되어 있습니다:

• "start": npm start로 실행할 수 있으며, node app.js 명령어를 실행합니다.

• "build": npm run build로 실행되며, Webpack을 사용해 빌드합니다.

• "test": npm run test로 Jest를 실행해 테스트를 수행합니다.

• "lint": npm run lint로 ESLint를 실행하여 코드를 린트합니다.

• "dev": npm run dev로 Nodemon을 실행하여 개발 중에 자동으로 서버를 재시작할 수 있습니다.

 

3. NPM Scripts 실행하기

NPM Scripts를 실행하는 방법은 간단합니다:

• npm start: "scripts" 항목에 정의된 "start" 스크립트를 실행합니다. 이때, npm run start와 동일하지만 start 스크립트는 run을 생략할 수 있습니다.

• npm run build: "build" 스크립트를 실행합니다.

• npm run test: "test" 스크립트를 실행합니다.

• npm run lint: "lint" 스크립트를 실행합니다.

Note: start 스크립트는 특별하게 run을 생략할 수 있지만, 나머지는 npm run 명령어로 실행해야 합니다.

 

4. Arguments 추가하기

스크립트에 인수를 추가할 수 있습니다. 예를 들어, 특정 환경에서만 빌드하도록 하고 싶다면:

{
  "scripts": {
    "build:prod": "webpack --mode production",
    "build:dev": "webpack --mode development"
  }
}

이 경우:

• npm run build:prod는 프로덕션 환경에서 Webpack을 실행합니다.

• npm run build:dev는 개발 환경에서 Webpack을 실행합니다.

 

5. NPM Scripts에서 명령어 연결

여러 명령어를 연결해서 사용할 수 있습니다. 명령어를 연속으로 실행하려면, "&&"로 연결할 수 있습니다:

{
  "scripts": {
    "build": "npm run lint && npm run test && npm run compile"
  }
}

이 스크립트는 npm run build를 실행하면 lint, test, compile 명령어를 차례대로 실행합니다.

 

6. Pre와 Post Hook

NPM Scripts는 pre와 post를 통해 특정 스크립트 앞뒤로 명령어를 추가할 수 있습니다. 예를 들어:

{
  "scripts": {
    "prebuild": "echo 'Linting before build...'",
    "build": "webpack",
    "postbuild": "echo 'Build completed!'"
  }
}

위 스크립트는 npm run build를 실행할 때, 먼저 prebuild 스크립트가 실행되고, build 스크립트가 실행된 후에 postbuild 스크립트가 실행됩니다.

NPM Scripts의 장점

• 자동화: 빌드, 테스트, 린트 등의 작업을 쉽게 자동화할 수 있습니다.

• 명령어 간소화: 복잡한 명령어를 짧고 기억하기 쉬운 형태로 간단하게 작성할 수 있습니다.

• 프로젝트 관리: 다양한 작업을 package.json에서 한 곳에서 관리할 수 있습니다.

 

이렇게 NPM Scripts를 활용하면 프로젝트 관리와 작업을 훨씬 간편하게 할 수 있습니다!

 

2024.10.11 - [분류 전체보기] - Visual Studio Code(VS Code)에서 NPM 명령어를 간편하게 실행하는 방법