npm-run-allでローカルAPI serverとHugo serverを同時に実行する
このブログではローカルでAPIサーバ(Express)を動かし、HugoのShortcodesから利用しています(2020/03/13現在)。 HugoでAMP対応のブログカードを作る - SIS Lab
そのため、記事を書いてHugoのプレビューを利用する場合は、2つのターミナルで以下のコマンドを実行していましたが、ちょっとだけ面倒です。
- API Server: npx ts-node src/app.ts
- Hugo Server: hugo server -D
そこで、npm-run-all
というライブラリを利用して、1つのターミナルで簡単にできるようにしました。
npm-run-allとは
npm-run-all
は、複数のnpmスクリプトを並列もしくは直列で実行するためのCLIツールです。
以下の3つのコマンドが提供されます。
- npm-run-all: コマンドオプションにより並列・直列実行、その他複雑な処理が行える
- run-p: 並列実行の省略コマンド
- run-s: 直列実行の省略コマンド
今回は単純な並列実行のためrun-p
を利用します。
npm-run-allで1つのターミナルでAPIサーバとHugoを動かす方法
事前に以下のコマンドでnpm-run-all
をインストールします。
npm install npm-run-all --save-dev
package.json
には、以下の通り設定をしておき、npm start
を実行したときに、ts-node src/app.ts
とhugo server -D
を並列実行するようにしました。
正確にはhugo server
を実行する前にAPIサーバが動作していないとうまくHugoのビルドが行われないのですが、接続タイムアウトになるまでには若干余裕があります。
今の所、接続タイムアウトになる前にはAPIサーバ起動できているので、支障は出ていません。
"scripts": {
"start": "run-p serve dev",
"serve": "ts-node src/app.ts",
"dev": "hugo server -D",
},
$ npm start
> [email protected] start /github-pages
> run-p serve dev
> [email protected] serve /github-pages
> ts-node src/app.ts
> [email protected] dev /github-pages
> hugo server -D
Building sites … Listening on port 6060
| EN | JA
-------------------+-----+-------
Pages | 36 | 1614
Paginator pages | 0 | 155
Non-page files | 0 | 0
Static files | 154 | 154
Processed images | 0 | 0
Aliases | 15 | 493
Sitemaps | 2 | 1
Cleaned | 0 | 0
Built in 6037 ms
Watching for changes in /github-pages/github-pages/{archetypes,content,data,layouts,static,themes}
Watching for config changes in /github-pages/github-pages/config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
まとめ
npm-run-all
のnpmライブラリを利用することで、ローカルにAPIサーバを立ててHugo Serverでのプレビュー表示が簡単に行えるようになりました。
ctrl + c
で終了させれば、APIサーバも自動的に停止しますのでプロセスが残って、ポートが重複することもありません。
これでまたちょっとの面倒が解消されました。
参考
Related contents
TECH
2023.02.03
TECH
2022.08.14
TECH
2019.10.11
TECH
2019.10.06
TECH
2017.12.22
TECH
2017.10.07
TECH
2017.01.08
TECH
2016.09.08