Skip to main content

npm run start, build の前処理を書きたい

やりたいこと​

  • HTMLが生成される前に、Markdown 整形などの、前処理を入れたい

方法​

  • シェルスクリプトなどを用意しといて、package.json に書けばよい
  • いくつかやり方があるが、結果 出来ることは同じ
  • いずれのケースも、処理停止させたければ 非0 で exit すること

と、書いたけども、node.js が書けるなら、シェルスクリプトでなく node.js で書いておくと、
Win/Mac 両対応できて良い。

記載例1. シェル直接呼ぶ​

package.json
{
  "scripts": {
    "start": "tools/do-something.sh && docusaurus start",
    "build": "tools/do-something.sh && docusaurus build",
    ...
  }
}

記載例2. コマンドの名前を定義しておいて、それを呼ぶ​

package.json
{
  "scripts": {
    "prepare-docs": "tools/do-something.sh", // ← これ単体で呼ぶケースがあるとしたら、それも利点か
    "start": "npm run prepare-docs && docusaurus start", // ← 同じ定義を使いまわしているのが利点か
    "build": "npm run prepare-docs && docusaurus build",
    ...
  }
}

記載例3. pre<command> というスクリプト名で用意​

package.json
{
  "scripts": {
    "prestart": "tools/do-something.sh", // ← preXXXX なら XXXX の前に呼ばれる。これは npm のスクリプト機能
    "prebuild": "tools/do-something.sh",
    "start": "docusaurus start", // ← 既存の行を直接変更しなくて良いのは利点か
    "build": "docusaurus build",
    ...
  }
}

脱線した話​

  • preprebuild と書いても prebuild が呼ばれるわけではない (= 多重は不可)
  • postbuild (後処理) もある。使い道は何だろう
    • upload 処理？ (run serve でテストしないならそれも良いか)
    • 生成された html を元に何かする (検索インデックスとか。上級者・・)
Last updated on