問題タブ [gatsby-image]

条件付きでレンダリングしgatsby-imageたい: モバイル用とデスクトップ用に異なる画像が必要です。だから私はそれらを交換する必要があります。

今、私はこれをやっています：

ここで<Desktop>&は、ビューポートに依存する<Mobile>メディア クエリを使用してスタイル設定されたコンポーネントです。display: block / display:none

しかし、これはここで最も効果的な解決策ですか? 私のソリューションは常に両方の画像をバックグラウンドでロードしていますか?

がなければgatsby-image、私はこれをします：

...しかし、それはここで使用しないことを意味しgatsby-imageます-私は使用したいです.

したがって、ローカルで gatsby プロジェクトを問題なくビルドできますが、Netlify がビルドしようとするとエラーが発生します。

完全なエラーを正しく表示するには、本番モードでビルドする必要があることを本質的に伝えているのはどれですか? ローカル コンピューター上にあるため、運用モードで問題ありません。

私は使用gatsby-imageしてgatsby-background-imageいますが、どれが問題を引き起こす可能性がありますか? gatsby-remark-relative-imagesを追加しようとし、このブログ投稿の指示に従いましたが、それでも同じエラーが発生します

また、何もしないノード バージョンの環境変数を追加しましたが、Netlify と Gatsby のこの「ステップ バイ ステップ」ガイドで役立つ可能性があることを読みました。

これは、Netlify が提供するコンソール ログ全体です。

gatsby-node.js

マークダウン テンプレート

特定のファイルを見たいかどうか尋ねるだけです