Netlify CMSで Incorrectly eaten value エラーが発生した時の対処法
こんにちは、Gaji-Labo アシスタントエンジニアの石垣です。
今日は前回の記事「Netlify CMSを使っている環境で、CMSでのコンテンツ作成とCMSを介さないコンテンツ作成を同時に行っている際に気をつけたいこと」と関連するのですが、GatsbyJS + Netlify CMS の環境で、CMS上であるコンテンツを編集しようとした際に、 Incorrectly eaten value というエラーが発生した時の対処法についてまとめたいと思います。
エラーの内容
手元で直接 Markdown ファイルを追加してコンテンツをリリースした際、該当するコンテンツをCMSで編集しようとすると Incorrectly eaten value というエラーが出て編集が出来ないことがありました。
エラーメッセージには remarkjs の問題と出ていましたが、remarkjs に立っている issue を見る限り Netlify CMS 側の問題である可能性が高そうです。
調べたところ、どうやら Markdown ファイル上で frontmatter の後に空行と画像が書かれているために発生するバグのようでした。
...
thumbnail: '/xxx.jpg'
---
...対処法
これを防ぐために、空行を削除して frontmatter の直後に画像が来るようにしました。
...
thumbnail: '/xxx.jpg'
---
...これでIncorrectly eaten value というエラーが出ることは無くなりました。
CMS上で編集した際には frontmatter と画像の間に空行が挟まることは無いため、CMSと直接編集を併用している時に特有で起きる現象です。
まとめ
今回は Netlify CMS を使っている際、 Incorrectly eaten value というエラーが発生した時の対処法についてまとめました。
このエラーに遭遇した際に役立てていただけると嬉しいです。
Gaji-Laboでは、JavaScriptフレームワーク経験が豊富なパートナーさんを募集しています
Gaji-Laboでは、開発チームの一員としてプロジェクトに一緒に取り組んでくれる業務委託のパートナーさんを募集しています。
現在は特にJavaScriptフレームワーク実践と業務経験が豊富なWebフロントエンドエンジニアを必要としています。React + TypeScript、Vue.js、Next.js、Nuxt.js など、あなたの得意なフレームワークを教えて下さい！
パートナー契約へのお問い合わせもお仕事へのお問い合わせも、どちらもいつでも大歓迎です。まずはオンラインでのリモート面談からはじめましょう。ぜひお気軽にお問い合わせください！
お問い合わせしてみる！
