GatsbyJS製ブログをNetlifyでbuildしたら3度失敗したのでその知見

こちらの動画を参考に、GatsbyJS＋ContentfulというHeadlessCMSを使ったブログを開発しました。

www.youtube.com

ぶっちゃけ作るだけならそこまで労せずでしたが、動画に書かれていない先、
Netrifyへのデプロイで3度詰まったので覚書を兼ねて記載。

アクセストークンの指定漏れ

問題：TypeError: Expected parameter accessToken
結論：開発環境なら.envで指定するアクセストークン、当然Netlifyにも教えてあげなきゃ駄目です。

特に行き詰まったというよりそりゃなって思った内容ですが、載せておきます。

セキュリティのためCMSへのアクセストークンは環境変数に指定すべきですが、
NetrifyのWebから環境変数を指定する場合の起動経路は以下。

Settings > Build&Deploy > Build environment variables

ファイルシステムが無い

問題：The path passed to gatsby-source-filesystem does not exist on your file system: 結論：指定していたディレクトリblogが、cloneしたばかりの時にMarkdownを全て消したため、Githubにpushされていませんでした。

gatsby-config.jsに書いたgatsby-source-filesystemプラグインに渡している引数としてのファイルシステムの指定が存在しないと言われている。エラーログを読む癖がある私はすぐに分かりましたとも。

いや待って、私そこイジってないよ？

    {
      resolve: `gatsby-source-filesystem`,
      options: {
        path: `${__dirname}/content/blog`,
        name: `blog`,
      },
    },

clone元のソースからイジってないし、イジる必要があるとも思えない。
開発環境では動く。
でも無いというからには無いんだろう、と思ってGithubを見に行くとblogディレクトリ、確かに無い。

.gitignoreに書いているわけでもないのに何で？　と首を傾げましたが、どうやらgitは空のディレクトリは管理しないらしい。
管理させたい場合は.gitkeepというファイルを作って該当ディレクトリに入れるのがスタンダードだと。
Netlify関係ないし知ってる人なら知ってそうですが、とりあえずNetlifyで詰まったポイントなのでここに書きます。

プラグインの中のGraphQLが実行できなくて怒られる

問題：

8:01:17 PM: error Plugin gatsby-plugin-feed returned an error
8:01:17 PM: 
8:01:17 PM:   Error: Cannot query field "allMarkdownRemark" on type "Query".
8:01:17 PM:   GraphQL request (3:9)
8:01:17 PM:   2:       {
8:01:17 PM:   3:         allMarkdownRemark(
8:01:17 PM:              ^
8:01:17 PM:   4:           limit: 1000,

結論：gatsby-plugin-feedは現在の私には用事が無いので外しました！

gatsby-plugin-feedは、motto2さんの記事によるとRSSを作成する責務を持つプラグインです。
mottox2.com

直近では使わないと判断したため、gatsby-config.jsからコメントアウト。

というわけでデプロイに成功しました。

この後改造していきます！