[yarn] Lifecycle Scripts - pre<command>, post<command>가 실행되지 않는 문제

Lifecycle Script란?

Lifecycle Script란 특정 커맨드의 실행과 연계하여 전후에 실행되는 스크립트를 의미합니다.

---

개요

npm은 특정 스크립트의 실행 전후에 다른 스크립트를 연계하여 사용할 수 있도록 pre, post 스크립트의 작성을 지원하고 있습니다. pre<command>는 <command> 실행 시 자동으로 <command>에 앞서 실행되며, post<command>는 <command> 실행 시 <command> 실행 이후에 실행됩니다.

예를 들어, package.json의 scripts 항목을 다음과 같이 작성합니다.

{
  "scripts": {
    "prestart": "echo 'start 실행 준비중입니다.'",
    "start": "node index.js",
    "poststart": "echo 'start 실행을 완료하였습니다.'"
  }
}

// index.js

console.log("Hello, world!");

 

`npm run start` 커맨드를 실행하면 다음과 같이 출력됩니다.

> package-name@0.1.0 prestart
> echo 'start 실행 준비중입니다.'

start 실행 준비중입니다.

> package-name@0.1.0 start
> node index.js

Hello, world!

> package-name@0.1.0 poststart
> echo 'start 실행을 완료하였습니다.'

start 실행을 완료하였습니다.

반면, `yarn start` 커맨드를 실행하면 다음과 같이 출력됩니다.

Hello, world!

 

yarn은 yarn이 지원하는 경우를 제외하고는 임의의 커맨드에 대하여 pre, post 커맨드를 지정하여 사용할 수 없도록 하였음을 밝혔습니다. 아래는 공식 문서에 실린 내용 일부를 번역한 것입니다.

안내

npm에 원래 존재했던 모든 라이프사이클 스크립트를 지원하지 않는 점에 유의하세요. 이는 어떤 라이프사이클 스크립트를 사용할지 결정하는 것이 어려워지고, 그로 인해 혼란과 실수가 발생할 수 있다는 관찰을 바탕으로 의도적으로 내린 결정입니다. 설득력 있는 사용 사례가 제공되면 누락된 스크립트를 경우에 따라 추가할 수 있습니다.

특히, 우리는 사용자 정의 스크립트에 대해 임의의 pre 및 post 훅(예: prestart)을 지원하지 않기로 의도적으로 결정했습니다. 이러한 동작은 스크립트가 암시적으로 실행되게 만들어 실행 흐름을 불명확하게 했으며, 때때로 yarn serve가 yarn preserve를 실행하는 것과 같은 예상치 못한 동작을 초래하기도 했습니다.

Lifecycle Scripts | Yarn

---

결론

yarn 사용 시 pre<command>, post<command>는 사용할 수 없습니다. <command> 스크립트에 전부 작성하는 방식으로 활용합니다.

저는 단순히 빌드 커맨드 실행 전에 dist 디렉토리를 제거하고 싶었습니다. 쉘의 AND 연산을 이용하여 prebuild의 역할을 대신합니다.

{
  "scripts": {
    "build": "rm -rf dist && parcel build src/index.html"
  }
}