エラー内容
Typescript化したGatsbyをNetlifyでビルドを行うと以下のエラーが発生しました。
error Error in "/opt/build/repo/gatsby-node.js": Unexpected token '.'
Error: /opt/build/repo/src/helpers/create-pages.ts:63
path: post.previous?.frontmatter?.path,
^
SyntaxError: Unexpected token '.'Unexpected token '.'しかエラー情報がなくローカルではエラーが発生しなかったのでしばらく気づかなかったのですが、 どうやらOptional Chainingでエラーが発生している模様。
解決策
解決策は Manage build dependencies に書かれているように、 Netlifyの環境変数のNODE_VERSIONを指定することでローカルのNode.jsのバージョンと合わせたらエラーが発生しなくなりました。以下の部分です。
Optional ChainingはTypescript3.7, Node.js v14から使用できる機能でtsconfig.jsonのcompilerOptions.targetが"ESNext"だったためトランスパイル対象にならず、 Netlifyのビルド環境のNode.jsがv12.18.0だったのでエラーとなっていました。
なので対処法としてはNode.jsのバージョンを変更する他にcompilerOptions.targetを変更しても試してはいませんが動くのかなと思っています。 M1 Macを使用しているためNode.js v13を入れられないので確認はできていないです。
NetlifyはNode.jsの他にRuby,Python,Go,Swift,Rustなどが使用できてそれぞれ環境変数でバージョンの指定ができます。 設定できる内容は Build environment variables に書かれています。
おわりに
devDependenciesの内容はインストールされないのでは？と思ってdependenciesに移したり、原因を探るためにどうにかしてローカルでエラーを発生させようと何回も試したのですがNode.jsのバージョンで解決できてしまったのでもっと早く気づいていればと思いました。