こんにちは，むぎやんです．

先日GitLabでこのサイトのソースなどを管理するようにしました．ついでなのでありがちですが，Netlifyと連携させてビルド&デプロイを自動化させました．その際に開発環境ではエラーが出ないのにNetlifyでビルドするとエラーになる現象が発生したので，その備忘録です．

エラー

こんなエラーが出ました．

2:54:12 PM: error
2:54:12 PM: The path passed to gatsby-source-filesystem does not exist on your file system:
2:54:12 PM: /opt/build/repo/src/pages
2:54:12 PM: Please pick a path to an existing directory.
2:54:12 PM: See docs here - https://www.gatsbyjs.org/packages/gatsby-source-filesystem/
2:54:12 PM: See our docs page for more info on this error: https://gatsby.dev/issue-how-to
2:54:13 PM: Skipping functions preparation step: no functions

gatsby-source-filesystemというプラグインが探しているディレクトリが存在しないと書いてありますね．

原因

エラーメッセージの通りなのですが，gatsby-source-filesystemが参照するディレクトリの一部がリモート上に存在しないせいでした．開発環境にはディレクトリは存在するのでエラーが出ずリリースするまで気付きませんでした．

調べてみると，gitは空のディレクトリを管理してくれないようです．そして今回空のディレクトリがあったため，そのディレクトリがgitの管理対象に含まれなかったようです．で，リモート上に存在しない状態に，，，

解決策

今回問題になったディレクトリは，ディレクトリそのものはgitの管理対象，その中のファイルたちは管理対象外にしたい場所でした．ということで，以下の対応をしました．

.gitkeep作成

まず管理対象のディレクトリに.gitkeep(慣習でこの名前ですがなんでもOK)というファイルを作成します．ファイルの中身は空っぽでOKです．

$ touch 管理対象のディレクトリ/.gitkeep

これで無理矢理？空のディレクトリでは無い状態にします．

.gitignoreに追記

次に.gitignoreに，管理対象外のファイルの指定と，例外的に.gitkeepだけは管理対象にする記述を追記します．

/管理対象のディレクトリ/*
!/管理対象のディレクトリ/.gitkeep

参考サイト

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