はじめに
Next.jsのアプリをfirebaseでデプロイする際に下記のエラーが出ました。
Error: Cannot deploy a web framework from source
because the experiment webframeworks is not enabled.
訳：webframeworksが有効化されていないからソースからwebframeworkをデプロイできません。
事象の経緯
Next.jsのアプリをfirebaseでデプロイする際にこちらの記事を参考にしました。
この記事にあるようにfirebase init をすると以下の質問が出てくるはずなのですが、今は仕様が変わったのか質問が出てきませんでした。
=== Hosting Setup
? Do you want to use a web framework? (experimental) (y/N)
そしてfirebase.jsonのsourceに"."を設定したのですが、認識されず今回のエラーが出てしまいました。
エラー内容を見ていると原因としては web frameworksが有効化になっていないことなので、有効にすることでエラーを解消します。
解決方法
firebase initでセッティングが終わった後に、以下のコマンドを実行します。
firebase experiments:enable webframeworks
こうすることでwebframeworksを有効化することができ、firebaseデプロイ時に必要はfirebase-toolsを使用することもできるようになります。
確認してみると、以下のようにfirebase-framework-toolsのReadMeにもwebframeworkが認識されるのを有効化するためにこのコマンドが記載されていました。
おまけ
ちなみに私は混乱してしまったのですが、firebase-tools とfirebase-framework-toolsは別のものを指します。
通常であればfirebaseデプロイのステップで以下のコマンドを実行し、firebase-toolsをインストールし有効化することでfirebaseのサービスが利用可能になります。
npm install -g firebase-tools
ただし、Next.jsではこのインストールだけではfirebase-toolsが使えずデプロイに問題が出てきます。
その時にfirebase-framework-toolsというweb frameworksを有効化することでNext.jsでもFirebaseのサービスや機能を使用することが可能になります。
firebase-framework-toolsは特定のフレームワークサポートのための拡張機能的なもののようです。
おわりに
Next.jsアプリをfirebase利用してデプロイする手順はいくつか紹介されているのですが、
こういうエラーが出た時の対処情報が上記の記事以外に見つけることができなかったため共有させていただきます！参考になれば幸いです。