スキップしてメイン コンテンツに移動

投稿

ラベル(CircleCI)が付いた投稿を表示しています

Nuxt.jsを短期間でFirebaseにデプロイしてCircleCIで自動デプロイをするところまでを設定するマニュアル

楽をするのは良いことだ 環境 構築 Firebase Nuxt.js 楽をするのは良いことだ ということで、個人的に好きで使っているNuxt.jsをFirebaseにデプロイし、その後Githubにプッシュするたびに自動的にデプロイされるように設定するまでをこの記事では解説しておきます。 Firebase使ってみた こちらの記事を参考にさせていただきました。 環境 OSX Catalina npm version6.14.6 node.js v12.18.4 構築 Firebase まず Firebase にログインします。 Googleアカウントが必要となるので持っていない方は取得してください。 こちらのページにアクセスしたら使ってみるをクリックし、以下の個人のプロジェクトを管理するページに移ってください。 そしてプロジェクトを追加をクリックし、任意のプロジェクト名を設定し、プロジェクトを作成してください。 これでプロジェクトを作成できました! ひとまずターミナルを開き、以下のコマンドを使ってFirebase CLIをインストールしておきましょう。 $ npm install -g firebase-tools そしてついでにログインをしておきましょう。 $ firebase login 次はNuxtプロジェクトを作成し、Firebaseとつないでデプロイしてみましょう。 Nuxt.js mkdir firebase cd firebase vue init nuxt-community/starter-template sample こちらでfirebaseディレクトリ内にNuxtのテンプレートが作成されました。 そして次にfirebaseとつなぐ必要があるので以下のコマンドをターミナルで実行してください。 また、ここではHostingを選択してください。 $ firebase init MacBook-Pro sample % firebase init ######## #### ######## ######## ######## ### ###### ######## ## ## ##