next devのオプションを見てみる

はじめに

react+viteで開発していたときにローカル環境でhttpsで起動するためにわざわざ証明書と鍵を作っていました。
それがnextjsだと起動時のコマンドに --experimental-httpsオプションをつけるだけでできたのが便利で、他にどんなオプションがあるのか気になって調べてみました。

オプション

--turbopack

vercelが開発した、javascript, typesciptのビルドに最適化したバンドラーであるturpopackを有効化するオプションです。
Bunでnextjsアプリを始めるとデフォルトでpackage.jsonにのscriptに書かれていました。
とにかく速くなるだけっぽいので、とりあえずつけておけばいいのかもしれない。

--port 数字

ポート番号を指定できます。

--hostname ホスト名

他のデバイスからアプリを使用するときに便利らしいです。
これ指定しなくても自動で起動してくれてるので、用途がわからなかったです。

--experimental-https

生成した自己証明書を使い、HTTPSサーバーを起動します。
HTTPSの起動時は、バックエンドもHTTPSでないとブラウザの仕様で通信できなくなることがあるのでそのあたりは注意です。
やっている内容についてはこちらの記事が参考になりました。🙏
https://zenn.dev/ikuma/articles/how-next-do-https-at-local

--experimental-https-key --experimental-https-cert --experimental-https-ca

HTTPS キー、証明書、証明機関を指定してサーバーを起動します。
とりあえずHTTPSで開発できればOKであれば--experimental-httpsのみでいいですが、特定の証明書を使いたい場合はこちらのオプションを使います。

--experimental-upload-trace

「デバッグ トレースのサブセットをリモート HTTP URL に報告します。」とあります。
これに関しては調べても公式ドキュメント以外にヒットしなかったので、おそらく使っている人はいないのかなと思います。

他にも

上記のオプションはこのページに書いてます。
20個くらいあるのかなと思っていたのですが、意外と少なかったです。

devの他にもbuild, start, lint, あとアプリケーション情報の収集に関するtelemetryについてもここからみられます。
https://nextjs.org/docs/pages/api-reference/cli/next#next-dev-options

telemetryは初めて知ったのですが、iphoneの初期化時に聞かれるような、開発に使うための情報収集みたいな話っぽいです。
こちらデフォルトで有効になってるみたいなので、気になるのであればdisableにしておいた方がいいですね。