firebaseのHosting機能を利用して、アプリケーションをインターネットに公開する方法を記載します。
ここでは、ターミナルを使ってアプリをデプロイする手順を記載します。
前提として、作成したアプリはVue.jsを使っており、Firebaseプロジェクトは既に作成済みとします。
それでは、手順を記載していきます。
- firebase-toolsのインストール
まず最初に、firebase-toolsをインストールします。
firebase-toolsをインストールすることで、firebaseプロジェクトの管理、表示、デプロイを可能にします。
npm install -g firebase-tools
2.firebaseにログイン
firebaseプロジェクトを扱うため、firebaseにログインが必要です。
firebase login
3.プロジェクトの設定
ここでホスティングの設定を行います。
firebase init
コマンド実行後に出てくる最初の選択肢は、十字キーで移動ができます。
そして、スペースボタンを押すことで選択をすることができます。
エンターボタンで決定です。
複数選択肢がありますが、ここではHostingを選択しましょう。
○Hosting: Configure and deploy Firebase Hosting sites
○他の選択肢
・・・
次に公開ディレクトリを聞かれます。
ここでは、distと回答しましょう。
その後、シングルアプリケーションの設定をするか聞かれるので、yと回答します。
? What do you want to use as your public directory? (public) dist
? Configure as a single-page app (rewrite all urls to /index.html)? (y/N) y
これで設定が完了です。
4.アプリのビルド
この記事では、Vue.jsでアプリを作成しています。
このアプリをビルドすれば、先ほど設定したdistディレクトリに、コンパイルされたファイルが置かれます。
npm run build
5.firebaseにデプロイする
先ほど作成したアプリをインタネット上に公開するため、デプロイを行います。
デプロイが成功すると、Hosting URLと記載した場所にアプリが公開されます。
firebase deploy
...
Hosting URL:https://□□□□□□□□□□□□
6.まとめ
このようにfirebaseは、簡単にアプリをインタネット上に公開できます。
フリープランでは、コンテンツのサイズなどに制限があることに注意してください。