package.json의 scripts의 활용 ( &&, pre-, post- )

 

package.json의 scripts

리액트, 뷰로 CRA나 CLI로 개발환경 세팅후
자주 실행해야 하는 명령어를 package.json의 scripts에 작성하여 npm 명령어로 실행 할 수 있다.

 

실행

실행시에는 아래와 같은 같은 형태로 사용하고,

 

npm run 스크립트이름

 

 

등록

등록시에는 아래의 형태로 이름과 명령어를 key value형태로 입력한다.

 

{  
  "scripts": {  
         "script_name": "echo some\_command\_here"  
    }  
}

 

 

 

---

 

 

어떤 스크립트 실행시, 한개의 스크립트로 여러개의 명령어를 실행하고 싶거나
특정 스크립트 이전이나 이후에 특정한 명령어를 실행하고 싶은 경우 

아래의 두가지 방법 사용이 가능하다.

 

예시 >  테스트를 실행하기 전에 일부 테스트 로그를 삭제하고 나중에 린터를 실행하는 경우

 

1.  &&를 사용

하나로 합쳐졌지만, npm 스크립트가 무엇을 하는지 명확하지 않고,

오류가 발생하면 스크립트의 어느 부분이 실패했는지 확인하기 어려울 수 있다.

2. pre- , post- 사용

pre-로 시작하는 스크립트는 그 뒤에오는 스크립트 명과 일치하는 스크립트 실행 전에 실행,

post-로 시작하는 스크립트는 그 뒤에오는 스크립트 명과 일치하는 스크립트 실행 후에 실행된다.

 

이렇게 하면 각 스크립트의 기능이 훨씬 더 명확해지고
오류가 난 경우에 어떤 스크립트가 실패했는지 정확히 알 수 있으므로 오류를 디버그하기가 훨씬 쉽다.

 

하지만 여러 스크립트에 각각 사용하는 경우 package.json이 지저분해 질 수 있다..

 

위에서 예시로 든 test는 테스트용 이름이였고,

지정한 스크립트 이름 앞에 pre 또는 post를 추가하기만
하면 모든 npm 스크립트에서 pre- , post-를 사용할 수 있다.

 

 

 

 

간단하고 오류가 날 경우가 없고, 분리가 필요하지 않은 명령어의 경우에 &&를 사용하는것을,
명령어가 길어져서 명확하게 분리해야 할 경우는 pre- , post-를 사용하는 형태로

사용자의 의도에 따라 나눠서 선택해 사용하면 될것같다.

 

 

 

---

✔️ 참고

https://www.yld.io/blog/using-npm-pre-and-post-hooks/