まずgithubにリポジトリを作る

とりあえずprivateで作る。

nuxt.jsをインストール

ローカルのgitフォルダにプロジェクトを作る。

$ npm i create-nuxt-app フォルダ名

github、sourcetreeを連携しようとするもエラー

「すでにフォルダがあるよ」と両方から怒られる。
→挫折。一度睡眠。

17:30 起床
nuxt.jsとgithub、sourcetreeの連携
参考「Nuxt.jsをGitHubで管理する」

原因
sourcetreeで
新規＞URLからクローン
をしていたため。

sourcetreeで管理する

SourceTreeを起動し、
新規 > 既存のローカルリポジトリを追加

pushしようとするもマスターが表示されない

解決方法

$ git add .git
$ git commit -m "first commit"
$ git remote add origin ここにgitのリポジトリのURL
$ git push -u origin master

ブランチの追加をコマンドラインで行う。

一度、gitのリセットして.gitフォルダを作る

$ git init

今度はgitコマンドのエラー

xcrun: error: invalid active developer path (/Library/Developer/CommandLineTools), missing xcrun at: /Library/Developer/CommandLineTools/usr/bin/xcrun

解決方法
Xcodeのインストールで解決する。

再度、コマンドを打つと無事成功。
これでsourcetreeでgit管理できるようになった。

firebaseへホスティング（デプロイ）する。

参考「Nuxt.jsで作成したWebサイトをFirebaseでホスティングする」
nuxt.config.jsを変更する。

nuxt.config.js

build: { 
  ... 
}, 
generate: { 
  dir: 'public' 
}

静的ファイルを書き出してみる。

npm run generate

publicフォルダに吐き出されたみたいので次に進む。

firebaseにプロジェクトを作る

firebase-toolsを入れていなかったらインストールする。

npm install -g firebase-tools

とりあえずfirebaseにログイン

firebase login

ログイン後にfirebaseの初期化（設定し直す）

firebase init

いろいろ聞かれますが
一応、hosting以外も全て使うようにする。

デプロイしてみる

firebase deploy

エラーになる...

firebase.jsonエラー

Not in a Firebase app directory (could not locate firebase.json)

アプリの追加をする
「このアプリのFirebase Hostingも設定します。」
にチェックを入れて、アプリを登録

firebase.jsonエラー2

まだエラーが出る。
全てにチェックしたのが原因みたい。
firebaseの管理画面で

cloud Firestore
realtime database

を作成する
またターミナルでfirebaseからいろいろ聞かれるが全てyesで答える。

すると作業ディレクトリに
firebase.json
が作成される。

デプロイするとまたエラー...

参考SSRで作ったNuxtアプリをFirebase hostingで動的にデプロイする。

/functions/package.json
にnodeのバージョンと~~Nuxtを追加~~。
~~Nuxtのバージョンはnuxt.config.jsに記述されているのを追加。~~
（見直したらhostingだけだとこの設定は要らなかった。）
/functions/に$cdで移動して

npm install

そしてまた作業ディレクトリに戻ってデプロイのコマンドを叩く。

またエラー...

エラー内容

npm ERR! functions@ lint: `eslint .`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the functions@ lint script.

↓
firebase.jsonの

firebase.json

  "functions": {
    "predeploy": [
      "npm --prefix \"$RESOURCE_DIR\" run lint"
    ],
    "source": "functions"
  },

を削除

またまたエラー...

Error: HTTP Error: 400, Billing account for project

/functions/package.json
初めの方でnodeのバージョンを8→10が原因だった。

/functions/package.json

  "engines": {
    "node": "10"
  },

/functions/package.json

  "engines": {
    "node": "8"
  },

またまたまたエラー...

何回目だろうか。
ホスティングするディレクトを変更する。

firebase.json

  "hosting": {
    "public": ".nuxt/public",
    "ignore": [

↓

firebase.json

  "hosting": {
    "public": "public",
    "ignore": [

エラーですね...

Error: HTTP Error: 404, Requested entity was not found.

firebase toolsを最新のバージョンにすると解決するらしい。（インストールしてたつもりでも、こういうのはあるのですね）

最新にしてまたデプロイ

Error: package.json in functions directory has an engines field which is unsupported. Valid choices are: {"node": "10"}, {"node":"12"}, and {"node":"14"}.

/functions/package.json

  "engines": {
    "node": "8"
  },

/functions/package.json

  "engines": {
    "node": "10"
  },

デジャヴかと思い、10にする

エラーが変わった。

Error: Your project {プロジェクトID} must be on the Blaze (pay-as-you-go) plan to complete this command. Required API cloudbuild.googleapis.com can't be enabled until the upgrade is complete. To upgrade, visit the following URL:

https://console.firebase.google.com/project/{プロジェクトID}/usage/details

このプロジェクトのプランだとそのコマンドはできませんよ。プランを確認してね。
みたいなことが書いてある。
functionsだったり色々入れたので全てデプロイはできないということなのか。
なので
hostingだけにしてデプロイする。

firebase deploy --only hosting

すると

Deploy complete!

で、でき...！
しかし、あれ？firebaseの初期画面？？

npm run generate

を再度行って

firebase deploy --only hosting

再度アクセス

で、できた！！！

20:20 一応できた。

都度、エラーなどメモりながら作業をしていたのでまとめる

20:50 まとめ終わり

今後ちゃんと覚えること

gitについて
設定はちゃんと必要なものだけ入れること（firebaseでとりあえず全部入れたらエラーが出まくったから）
nodeのこと
npm、yern、npxの仕組み