Gatsby: Kesalahan / sumber daya halaman untuk / tidak ditemukan. Tidak merender React

Hai!

Masalah ini telah menjadi sunyi. Diam seram. 👻

Kami mendapatkan banyak masalah, jadi saat ini kami menutup masalah setelah 30 hari tidak aktif. Sudah setidaknya 20 hari sejak pembaruan terakhir di sini.
Jika kami melewatkan masalah ini atau jika Anda ingin tetap membukanya, balas di sini. Anda juga dapat menambahkan label "tidak basi" agar masalah ini tetap terbuka!
Sebagai pengingat: cara terbaik untuk melihat masalah ini, atau yang lainnya, diperbaiki adalah dengan membuka Permintaan Tarik. Lihat gatsby.dev/contribute untuk informasi lebih lanjut tentang membuka PR, memrioritaskan masalah, dan berkontribusi!

Terima kasih telah menjadi bagian dari komunitas Gatsby! 💪💜

@antoinerousseau akan membantu jika kami menyediakan stacktrace yang lebih baik? Seperti mungkin itu 404 atau mungkin data halaman tidak valid. Saat ini Anda tidak benar-benar melihat perbedaannya.

Menurut Anda, apa cara terbaik untuk bergerak maju? Apakah Anda mencobanya sendiri di safari / safari seluler?

@wardpeet terima kasih telah melihat ini.
Saya mencoba dengan desktop Safari dan saya tidak dapat mereproduksi. Saya tidak memiliki iPhone.
Saya tidak yakin bagaimana cara melanjutkan, karena ini hanya terjadi kadang-kadang dan secara acak, tetapi stacktrace yang lebih baik tidak ada salahnya.
Perhatikan bahwa itu hanya terjadi 124 kali, dengan 85% Mobile Safari, 10% Safari dan 5% Chrome Mobile iOS. Berbagai versi.
Juga URL tidak selalu / . Saya dapat memberi Anda akses ke akun Bugsnag jika Anda mau.

Saya mendapat laporan bug yang sama hari ini. Hanya untuk memberi tahu Anda bahwa Anda tidak sendiri.

Hai!

Masalah ini telah menjadi sunyi. Diam seram. 👻

Kami mendapatkan banyak masalah, jadi saat ini kami menutup masalah setelah 30 hari tidak aktif. Sudah setidaknya 20 hari sejak pembaruan terakhir di sini.
Jika kami melewatkan masalah ini atau jika Anda ingin tetap membukanya, balas di sini. Anda juga dapat menambahkan label "tidak basi" agar masalah ini tetap terbuka!
Sebagai pengingat: cara terbaik untuk melihat masalah ini, atau yang lainnya, diperbaiki adalah dengan membuka Permintaan Tarik. Lihat gatsby.dev/contribute untuk informasi lebih lanjut tentang membuka PR, memrioritaskan masalah, dan berkontribusi!

Terima kasih telah menjadi bagian dari komunitas Gatsby! 💪💜

Hai lagi!

Sudah 30 hari sejak terjadi sesuatu tentang masalah ini, jadi robot lingkungan kami yang ramah (yaitu saya!) Akan menutupnya.
Harap diingat bahwa saya hanyalah robot, jadi jika saya salah menutup masalah ini, saya HUMAN_EMOTION_SORRY . Jangan ragu untuk membuka kembali masalah ini atau membuat yang baru jika Anda membutuhkan yang lain.
Sebagai pengingat: cara terbaik untuk melihat masalah ini, atau yang lainnya, diperbaiki adalah dengan membuka Permintaan Tarik. Lihat gatsby.dev/contribute untuk informasi lebih lanjut tentang membuka PR, memrioritaskan masalah, dan berkontribusi!

Sekali lagi terima kasih telah menjadi bagian dari komunitas Gatsby! 💪💜

Melihat hal yang sama.

• Ini cukup sering (kami melihatnya setiap hari).
• Hampir semua Mobile Safari atau Safari.
• Hampir selalu / , tetapi sangat jarang halaman lain.
• Sentry memberikan stacktrace yang sama dengan Bugsnag dengan breadcrumb berikut:
  

Sama disini. Untuk halaman selain / index.

Alat
Merek | Huawei
Keluarga | DRA-LX5

OS
Nama | Android
Versi | 8.1.0

Browser
nama | Tampilan Web Seluler Chrome
versi | 70.0.3538

SDK
Nama | sentry.javascript.browser
Versi | 5.12.1

Hai!

Masalah ini telah menjadi sunyi. Diam seram. 👻

Kami mendapatkan banyak masalah, jadi saat ini kami menutup masalah setelah 30 hari tidak aktif. Sudah setidaknya 20 hari sejak pembaruan terakhir di sini.
Jika kami melewatkan masalah ini atau jika Anda ingin tetap membukanya, balas di sini. Anda juga dapat menambahkan label "tidak basi" agar masalah ini tetap terbuka!
Sebagai pengingat: cara terbaik untuk melihat masalah ini, atau yang lainnya, diperbaiki adalah dengan membuka Permintaan Tarik. Lihat gatsby.dev/contribute untuk informasi lebih lanjut tentang membuka PR, memrioritaskan masalah, dan berkontribusi!

Terima kasih telah menjadi bagian dari komunitas Gatsby! 💪💜

Masih menjadi masalah.

Saya juga mendapatkan masalah ini. gatsby develop berfungsi dengan baik, tetapi gatsby build menyebabkan aplikasi rusak dengan "Kesalahan: sumber daya halaman untuk / tidak ditemukan. Tidak merender React." pada waktu proses meskipun pembuatannya sendiri berhasil.

Mungkinkah ini disebabkan oleh fakta bahwa saya menggunakan Typecript?

Saya telah mencoba menjalankan gatsby clean

Update / Kemungkinan Solusi : Bagi saya kesalahan itu disebabkan karena saya hanya memiliki file ".env.development" dan bukan file ".env.production". Saya tidak tahu mengapa ini memberikan kesalahan yang ambigu / membingungkan dan mencegah React dari rendering. Saya merasa perilaku yang diharapkan adalah perilaku yang sama seperti yang terjadi ketika saya menjalankan gatsby develop . Ketika saya menjalankan gatsby develop dan tidak memiliki file .env.development, React masih merender tetapi aplikasi saya crash karena kehilangan nilai-nilai pentingnya.

Saya punya masalah yang sama. Aplikasi saya dihosting di aws dan menggunakan cloudfront. Saya memiliki kebijakan untuk mengalihkan semua url yang tidak ada ke halaman 404.html dengan status 200 . Ini terlihat aneh, tetapi sangat penting untuk salah satu fitur kami. Jadi jika saya mengetik sesuatu seperti my-test-site.com/some-not-existed-page window.pagePath akan menjadi /404.html yang benar, tetapi publicLoader.loadPage entah mengapa mencoba memuat bukan 404.html konten halaman, tapi /my-test-site.com/some-not-existed-page . Sebenarnya itu menggunakan window.location.pathname tetapi tidak window.pagePath

Saya mendapat pesan kesalahan yang sama di Sentry hari ini: tidak ditemukan. Tidak merender React

Saya juga mengalami masalah ini. Bagi saya itu dapat direproduksi saat menggunakan impor bernama untuk komponen Anda sendiri di file pages/index.js .

Contoh
import Layout from "../components/Layout"; ✅
import { Layout } from "../components"; 🚫

components/index.js akan terlihat seperti ini:

import Layout from "./Layout"

export {
  Layout
};

Ini dengan MacOS catelina & chrome Versi 80.0.3987.149.
"gatsby": "^2.20.13",

Penting untuk dicatat bahwa saya menggunakan varian expo gatsby.

Saya juga mengalami masalah ini saat menjalankan bersih gatsby build dan akar penyebabnya adalah resolusi di package.json saya untuk kerentanan paket acorn (lihat https://snyk.io/vuln/npm :biji pohon ek):

"resolutions": {
   "acorn": "^7.1.1"
}

Menghapus resolusi ini memecahkan masalah bagi saya.

Keluaran dari gatsby info :

  System:
    OS: macOS 10.15.4
    CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.10.0 - /usr/local/bin/node
    Yarn: 1.22.4 - ~/.yarn/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm
  Languages:
    Python: 2.7.17 - /usr/local/bin/python
  Browsers:
    Chrome: 81.0.4044.92
    Safari: 13.1
  npmPackages:
    gatsby: 2.20.20 => 2.20.20 
    gatsby-plugin-material-ui: 2.1.6 => 2.1.6 
    gatsby-source-graphql: 2.4.0 => 2.4.0 

Masih banyak terjadi (4.500+ kali selama seminggu terakhir):

Stacktrace di Mobile Safari:

.cache/production-app.js:128:12

126  publicLoader.loadPage(browserLoc.pathname).then(page => {
127    if (!page || page.status === PageResourceStatus.Error) {
128      throw new Error(
129        `page resources for ${browserLoc.pathname} not found. Not rendering React`
130      )
131    }

Stacktrace di Chrome Mobile:

/app-ac76ae7860adc4ef4414.js:1:179819

Remah roti:

Waktu | Ketik | Kesalahan | informasi
- | - | - | -
4 md sebelum | PERMINTAAN | Kesalahan XMLHttpRequest | DAPATKAN /page-data/app-data.json
5 md sebelum | PERMINTAAN | Kesalahan XMLHttpRequest | DAPATKAN /page-data/index/page-data.json
6 md sebelum | PERMINTAAN | Kesalahan XMLHttpRequest | DAPATKAN /page-data/app-data.json
7 md sebelum | PERMINTAAN | Kesalahan XMLHttpRequest | DAPATKAN /page-data/index/page-data.json
10 md sebelum | PERMINTAAN | Kesalahan XMLHttpRequest | DAPATKAN /page-data/app-data.json
10 md sebelum | PERMINTAAN | Kesalahan XMLHttpRequest | DAPATKAN /page-data/index/page-data.json

Sebagian besar terjadi di Safari Seluler dan Chrome Seluler:

Versi Gatsby: 2.20.13

Periksa solusi ini.
https://github.com/gatsbyjs/gatsby/issues/11461#issuecomment -459732145

Saya tidak menggunakan gatsby-plugin-offline jadi tidak ada pekerja layanan.

Apakah ada kemajuan? Saya mengalami masalah, dan saya memiliki plugin offline, dan saya tidak dapat menonaktifkan plugin untuk menguji apakah terjadi kesalahan.

Saya rasa ini tidak ada hubungannya dengan plugin offline. Kami melihat banyak kesalahan ini dan tidak pernah menggunakannya.

Untuk mereproduksi:

• Pergi ke [contoh tidak lagi diperlukan, lihat di bawah], catat kesalahan di konsol dan React non-fungsional.
• Arahkan ke halaman beranda dengan logo di kiri atas.
• Kembali ke halaman asli dengan mengklik "Riset" di header. Halaman sekarang berfungsi dan panel bisa dilipat.

Bagaimana cara men-debug ini? Tidak ada permintaan jaringan yang 404 atau apa pun, jadi saya tidak mengerti apa yang terjadi. Versi lokalnya adalah sebagai berikut, tetapi pembangunan terjadi di Netlify:

  System:
    OS: macOS 10.15.3
    CPU: (4) x64 Intel(R) Core(TM) i5-8210Y CPU @ 1.60GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.16.1 - ~/.nvm/versions/node/v12.16.1/bin/node
    Yarn: 1.22.4 - ~/.yarn/bin/yarn
    npm: 6.14.4 - ~/.nvm/versions/node/v12.16.1/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 81.0.4044.122
    Firefox: 75.0
    Safari: 13.0.5
  npmPackages:
    gatsby: 2.21.1 => 2.21.1
    gatsby-image: 2.4.0 => 2.4.0
    gatsby-plugin-graphql-loader: 1.0.2 => 1.0.2
    gatsby-plugin-module-resolver: 1.0.3 => 1.0.3
    gatsby-plugin-page-creator: 2.3.0 => 2.3.0
    gatsby-plugin-react-helmet: 3.3.0 => 3.3.0
    gatsby-plugin-sharp: 2.6.0 => 2.6.0
    gatsby-plugin-typescript: 2.4.0 => 2.4.0
    gatsby-source-contentful: 2.3.1 => 2.3.1
    gatsby-transformer-remark: 2.8.0 => 2.8.0
    gatsby-transformer-sharp: 2.5.0 => 2.5.0

Dalam kasus kami, kami memiliki halaman sebagai ekspor default, kemudian memiliki ekspor bernama di file halaman juga. Segera setelah ada yang mereferensikan ekspor bernama dari luar file halaman, itu menjadi sangat membingungkan.

Perbaikannya adalah menghapus semua ekspor dari halaman kecuali ekspor komponen halaman aktual default.

@thekevinbrown Apakah kesalahan yang Anda lihat terputus-putus? Atau apakah itu terjadi setiap saat?

@Undistraction setiap kali Anda memulai atau menyegarkan halaman dengan masalah tersebut. Jika Anda memulai pada halaman yang berbeda, atau menavigasi dari halaman ke halaman yang berfungsi, lalu kembali, tidak apa-apa. Jadi pada dasarnya hidrasi awal gagal dalam kasus ini, sementara jika Anda dapat mengarahkan pengguna ke halaman lain tempat hidrasi berfungsi, maka pengunduhan dan tampilan halaman yang rusak berfungsi.

Pasti akan lebih baik sebagai error build yang jelas daripada error runtime yang tidak jelas jika memungkinkan.

@thekevinbrown jadi saya pikir masalah Anda tidak terkait dengan masalah ini (yang merupakan kesalahan intermiten yang tidak dapat direproduksi secara andal), jadi saya pikir meskipun Anda melihat kesalahan yang sama, penyebabnya berbeda (dan untungnya Anda dengan mudah memperbaikinya).

Mengalami kesalahan ini di situs prod kami dan meningkatkan ke versi Gatsby terbaru (rilis hanya 2 hari yang lalu) memperbaiki bug untuk Safari

Ditingkatkan ke versi Gatsby terbaru. Masalah masih terjadi

Saya belum pernah mengalami ini sebelumnya. Tiba-tiba itu terjadi setiap saat. Hanya dalam produksi 😢
Ini terjadi setelah pembaruan 20 jam yang lalu. Kami memperbarui dependensi secara teratur.
Jadi pada dasarnya proyek ini berhenti dan saya tidak tahu bagaimana membuatnya bekerja lagi.

Saya mencoba mengembalikan pembaruan ke keadaan 20 jam yang lalu. Tidak membantu.
Mengembalikan ke 8 hari yang lalu juga tidak membantu.

Ini adalah proyek dengan pembaruan yang agak baru: https://vermehrungch-4utm3ymcd.now.sh/Vermehrung/
Dan ini yang terakhir berfungsi dari 8 hari yang lalu: https://vermehrungch-9l709pu84.now.sh/Vermehrung/

Mengembalikan dependensi gatsby ke semula 9 Hari yang lalu membuat build baru berfungsi lagi 😆

Sekarang akan mencoba mengisolasi apa yang menyebabkan ketergantungan gatsby.

Oke, dalam kasus kami:

• pasti gatsby sendiri adalah penyebabnya
• versi hingga 2.20.36 berfungsi
• v2.21.2 dan v2.21.3 memiliki kesalahan di atas (saya telah menguji v2.21.17 sebelumnya, kesalahan yang sama)
• v2.21.0 memiliki kesalahan yang berbeda:
  idb-keyval-iife.min.js:1 Uncaught (in promise) DOMException: Failed to execute 'transaction' on 'IDBDatabase': The database connection is closing. at https://vermehrungch.gabriel-software.now.sh/idb-keyval-iife.min.js:1:353 at new Promise (<anonymous>) at https://vermehrungch.gabriel-software.now.sh/idb-keyval-iife.min.js:1:323 at async Object.handle (https://vermehrungch.gabriel-software.now.sh/sw.js:162:21)

Pembaruan: Kesalahan masih terjadi di gatsby v2.21.19

@barbalex Bisakah Anda membagikan situs Anda kepada kami? Jika bersifat pribadi, kirim email ke [email protected].

Saya mendapatkan kesalahan ini di situs Anda saat melakukan debug

[].concat(function(e) {
                if (Array.isArray(e)) {
                    for (var t = 0, n = Array(e.length); t < e.length; t++) n[t] = e[t];
                    return n
                }
                return Array.from(e)
            }(Object.keys(it.propTypes)), ["children"]);

Stacktrace:

TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at Module.zJQU (VM54 component---src-pages-vermehrung-js-c3ca1cb1b4686475777d.js:13787)
    at c (webpack-runtime-2b4bd8eda0563b1ea7e6.js:1)

Situsnya adalah:

• https://vermehrung.ch
• https://github.com/barbalex/vermehrung
• Anda bahkan dapat masuk menggunakan kata sandi yang dikirim dalam surat

Situs ini sedang dalam pengembangan. Jadi Anda bahkan bisa mengedit data.

Kami mendapat pesan kesalahan yang sama di Sentry berulang kali:

Kami menggunakan versi gatsby "2.21.22".

Saya mengalami masalah yang sama dan memperbaikinya dengan menurunkan versi ke v2.20.36, yang disebutkan di atas.

Oke, dalam kasus kami:

• pasti gatsby sendiri adalah penyebabnya
• versi hingga 2.20.36 berfungsi
• v2.21.2 dan v2.21.3 memiliki kesalahan di atas (saya telah menguji v2.21.17 sebelumnya, kesalahan yang sama)

Saya mengalami ini lagi di proyek lain yang memiliki versi 2.21.12. Ini _sangat_ buruk karena hanya terjadi dalam produksi. Harap prioritaskan bug ini.

Kami melihat ini dalam produksi di https://www.voteamerica.com/. Ini terjadi terutama di Safari Seluler, tetapi kami juga melihatnya di Android Chrome, Safari desktop, Chrome desktop, dan lainnya. Kami saat ini menggunakan Gatsby 2.21.40, tetapi kami juga melihat masalah tersebut di 2.20.12

Mendapat masalah yang sama untuk satu halaman yang baru-baru ini dihapus. https://intergiro.com/legal tidak menampilkan laman 404 tersuai seperti yang diharapkan (Chrome desktop, Gatsby 2.20.8). Terjadi hanya dalam produksi juga.

Dalam kasus saya, komentar @Kanuny secara tidak langsung menyelesaikan masalah saya. Saya tidak sengaja mengalihkan data halaman JSON ke file HTML ketika publicLoader.loadPage mencoba mengambilnya. Setelah memperbaiki pengalihan, JSON data halaman dimuat dengan benar dan semuanya berfungsi seperti biasa.

Bug itu tiba-tiba menghilang lagi. Sepertinya itu mungkin ditautkan ke cache atau sesuatu

Kesalahan masih terjadi di versi 2.22.12 di Firefox dan Chrome versi terbaru juga.

Tolong perbaiki!

Tolong perbaiki!

@SoldierCorp harap baca tentang apa itu Open Source dan mungkin coba perbaiki sendiri.

@antoinerousseau ini juga tentang membantu satu sama lain, di mana orang yang membutuhkan bantuan - memintanya, dan orang yang tahu caranya - menawarkannya. Jadi saya pikir komentar Anda tidak pada tempatnya.

@andrzejwp ya ini tentang membantu satu sama lain, bukan tentang memposting komentar suka memerintah seperti "tolong perbaiki!" tanpa informasi yang berguna untuk benar-benar memperbaiki masalah tersebut, sambil memberi tahu 25 orang yang mengikuti masalah ini.

Yang lain berkomentar dengan wawasan terperinci tentang bagaimana hal itu memengaruhi mereka, yang diperlukan agar kontributor membantu mereka dan semoga memperbaiki masalah OSS.

@antoinerousseau Tidak ada lagi informasi yang berguna terkait dengan yang satu ini karena tidak ada lagi informasi yang diberikan oleh masalah jadi itu terjadi begitu saja, jadi saya menulis bahwa untuk menghindari pengulangan hal yang sama yang orang lain tulis karena sama di akhir sampai akhir versi terbaru.

Hanya untuk memberi tahu Gatsby bahwa lebih banyak orang yang masih mengalami masalah dan belum diperbaiki.

Maaf jika itu mengganggu Anda, tetapi saya adalah pengguna biasa yang menggunakan framework dan tidak punya waktu untuk memperbaiki masalah sendiri.

Dalam kasus saya, ini hanya terjadi saat mengawali jalur, karena saya mencoba menggunakan gatsby-plugin-ipfs (Menjalankan gatsby build --prefix-paths && gatsby serve akan menghasilkan "Kesalahan / sumber daya halaman untuk / tidak ditemukan. Tidak merender React" untuk setiap halaman).
Namun, di halaman index.jsx saya, saya tidak menjalankan kueri halaman apa pun, tetapi saya memiliki komponen yang berisi staticQuery, dari hook useStaticQuery.
Jika saya mengomentari komponen ini dan membangun kembali, maka kesalahan akan hilang.
Yang cukup menarik, jika saya kemudian menghapus komentar komponen ini dan membangun kembali (sehingga situs kembali ke keadaan awal), maka itu akan berjalan dengan baik, dan tidak menemukan kesalahan "Kesalahan / sumber daya halaman untuk / tidak ditemukan. Tidak merender React", menyarankan bahwa build cache berisi sesuatu yang penting?

Jadi pemikiran (kasar) saya mengapa hal ini bisa terjadi adalah:

• Masalah dengan halaman indeks yang berisi kueri statis, tetapi bukan kueri halaman?
• Masalah dengan urutan proses build (karena caching dapat mengubah hasil).
• Berpotensi menjadi masalah dengan run static queries atau Generating image thumbnails dalam proses pembuatan, karena ini adalah satu-satunya langkah yang tampaknya dilewati berkat cache.

Saya tidak sengaja mengalihkan data halaman JSON ke file HTML

Situasi serupa di sini. Pada dasarnya, regex arahan nginx location juga cocok dengan /page-data/items/page-data.json ketika seharusnya tidak ada. Menambahkan ^ di awal regexp menghindari kecocokan yang tidak diinginkan.

Kami melihat ini dalam produksi di https://www.voteamerica.com/. Ini terjadi terutama di Safari Seluler, tetapi kami juga melihatnya di Android Chrome, Safari desktop, Chrome desktop, dan lainnya. Kami saat ini menggunakan Gatsby 2.21.40, tetapi kami juga melihat masalah tersebut di 2.20.12

Juga menghadapi masalah yang sama.

Hai tim Gatsby, hai semuanya. Apakah mungkin untuk menentukan kesalahan yang dikembalikan dalam loadPage yang tampaknya menjadi sumber dari berbagai kesalahan yang muncul dalam terbitan ini?

Lihat fungsi: https://github.com/gatsbyjs/gatsby/blob/030d927cddbdc64f8d93d409a5ada7442d5e62bf/packages/gatsby/cache-dir/loader.js#L179 -L242

Menurut pemahaman saya, fungsi ini mencoba memuat app-data.json , page-data.json dan kemudian komponen JS itu sendiri, sehingga sangat rentan terhadap masalah jaringan, masalah konfigurasi server, masalah dev, masalah konfigurasi ... Dengan menentukan pesan kesalahan, akan lebih mudah untuk memperbaiki masalah yang mendasarinya.

(Untuk referensi: kemunculan terakhir masalah ini di situs web kami adalah karena impor melingkar)

Saya mencoba lagi dengan v2.23.12. Hasil yang sama: https://vermehrungch-1j64x2olp.vercel.app/Vermehrung

Bagi kami ini tampaknya sangat sistematis karena setiap versi di atas 2.20.36. Di setiap lima aplikasi yang dibuat menggunakan gatsby. Jadi kami telah diblokir dari pembaruan sejak.

Yang mulai menjadi sedikit masalah. Misalnya kami diblokir dari menggunakan libs menggunakan core-js di v3 (https://github.com/gatsbyjs/gatsby/issues/15601). Masalah itu sekarang telah diatasi - jika kami _dapat_ meningkatkan versi.

Jika ada cara saya dapat membantu dengan informasi / tes / apapun, saya akan dengan senang hati.

@barbalex Anda memiliki kesalahan berikut di aplikasi Anda:

Kami pasti harus menunjukkan kesalahan ini. Jangan ragu untuk menambahkan PR, saya tidak memiliki cukup bandwidth untuk melakukan ini atm.

Tampaknya masalah ini dalam kasus kami disebabkan oleh menu react-context ketika lib itu digunakan di sisi server: https://github.com/vkbansal/react-contextmenu/issues/284 , yang tampaknya dipicu selama proses pembuatan.

@wardani

Jangan ragu untuk menambahkan PR, saya tidak memiliki cukup bandwidth untuk melakukan ini atm

Maaf, sepertinya saya tidak memiliki cukup sel abu-abu untuk itu 😢
Mungkin @ b4stien begitu ?

Masalah ini masih berlanjut pada versi 2.23.21

Saya belum mendapatkan solusi umum untuk ini, tetapi saya hanya ingin diketahui bahwa saya mengalami masalah ini pagi ini untuk pertama kalinya.

Dan saya berhasil "memperbaikinya".

Situs dihosting di AWS melalui penyedia yang disebut "Cloudways".

Sebagai tes awal, saya menerapkan situs tersebut ke Netlify - Dan semuanya bekerja dengan baik.

Setelah menggali sedikit, sepertinya ada masalah cache sisi server menggunakan sesuatu yang disebut "Varnish".

Saya pertama kali mencoba untuk "membersihkannya", dan tidak ada yang terjadi - Tapi menonaktifkan dan mengaktifkannya kembali berhasil.

Situs ini telah ada dengan baik selama sekitar 18 bulan di lingkungan ini dengan pembaruan rutin, dan ini adalah pertama kalinya saya mengalami masalah ini.

Saya baru saja meningkatkan ke:
Gatsby CLI versi: 2.12.59

Tidak yakin apakah ini bisa berpengaruh, tetapi itu satu-satunya perubahan yang dapat saya pikirkan - Kecuali tentu saja ada perubahan di sisi hosting.

Semoga ini membantu seseorang di luar sana 🤷

EDIT:

Masalah muncul kembali dalam 5 menit ketika saya mengaktifkan kembali cache "pernis".

Saya telah menonaktifkan fitur ini untuk saat ini.

Dalam kasus kami, setiap halaman yang dibuat dari folder /pages berfungsi tetapi sisanya yang dibuat oleh createPages gagal untuk rehidrasi.
Kami mengalami masalah ini pada lokal dan CI.

dalam kasus kami semua halaman dibuat dengan createPages , karena kami menggunakan internasionalisasi dengan awalan /${locale}/ setiap halaman.

dalam kasus kami semua halaman dibuat dengan createPages , karena kami menggunakan internasionalisasi dengan awalan /${locale}/ setiap halaman.

apakah Anda menemukan solusi untuk ini? kami juga memiliki penyiapan ini dengan banyak lokal

@kdichev Tidak, saya tidak menemukan solusi. Menunggu tim gatsby untuk memperbaikinya di tingkat perpustakaan.

Saya masih tidak yakin di mana masalahnya, saya akan dengan senang hati membuat PR untuk ini, tetapi apakah kami ingin mendapatkan dan menemukan di mana masalah yang mendasarinya?

Halo Teman-teman, saya menghadapi Masalah ini tentang produksi menggunakan IE11.

"gatsby": "^ 2.23.11"

Juga menghadapi hasil kosong (tidak ada hidrasi) dari semua halaman di IE11.
Sumber daya halaman untuk / tidak ditemukan. Tidak memberikan reaksi

Gatsby v2.24.2

EDIT: Saya kembali ke versi berfungsi sebelumnya v2.22.11. ie11 bekerja di komit itu dan dengan benar jadi itu juga berfungsi sekarang, meskipun hanya ketika saya menyimpan package-lock.json dan npm ci. Entah bagaimana, saya tidak yakin ini gatsby yang salah, jadi saya mencantumkan beberapa kemungkinan perubahan hilir yang mungkin relevan:
(versi kerja -> versi build gagal)
yang besar yang kemungkinan hanya kandidat untuk kegagalan IE11:
@ babel / inti 7.10.0 -> 7.10.5
@ core / js 2.6.11 -> 3.6.5
gatsby-legacy-polyfills dep baru 0.0.2

kemungkinan kecil lainnya:
@ graphql-tools / schema new dep 6.0.14
@ graphql-tools / utils new dep 6.0.14
dan kemudian kesabaran saya memilah-milah semua merah-> semua hijau di alat diff vscode habis

Hal-hal lain yang perlu diperhatikan: Saya mereproduksi kesalahan dengan gatsby build && gatsby serve -H 0.0.0.0, sehingga mengesampingkan hal-hal yang berkaitan dengan lingkungan server.

EDIT 2: Output build dari build v2.24.2 yang benar yang pertama kali dilaporkan di posting saya berubah dari 10mb menjadi 30mb. Ini memiliki sekitar 20 versi app- {hash} .js, 2 of commons- {hash} .js dan berbagai jumlah pages.js. Tampaknya bukan file yang sama dan tanggalnya cocok dengan versi sebelumnya. Jadi sepertinya gatsby build telah mendapatkan semua versi lama yang tersedia dan membuangnya ke / publik.

Adakah yang bisa membagikan repositori?

@roffelsaurus dapatkah Anda mencoba 2.23.22?
bagi kami 2.24.2 gagal dalam tes cypress ci / cd.

Adakah yang bisa membagikan repositori?

kami dapat membagikan repo dan vars kami secara pribadi, jika itu tidak masalah bagi Anda, silakan ping saya email di konstantin. [email protected] dan saya akan mengundang Anda ke gh kami

@wardpeet Anda dapat menguji masalah ini di repositori yang saya berikan kepada Anda akses terkait dengan masalah # 25766

Dalam kasus saya, masalahnya terkait dengan pemesanan import dan cara beberapa perpustakaan (yaitu react-leaflet ) ditangani di lingkungan rendering sisi server. Kami memiliki plugin selebaran yang diimpor sebelum selebaran itu sendiri menyebabkan masalah nanti. Saya dapat memperbaikinya dengan cukup cepat setelah saya tahu ke mana harus mencari.

Namun, saya percaya bahwa pesan kesalahan yang dihasilkannya ( page resources for / not found. Not rendering React ) sangat membingungkan dan kurangnya detail dan kesalahan lainnya adalah masalah utama karena saya harus menggali lebih dalam untuk mengetahui apa artinya.

Kepada orang lain yang mengalami masalah ini: Bagaimana saya menemukannya? Breakpointing dan debugging lama yang bagus di chrome. gatsby build && gatsby serve diizinkan untuk melihat lingkungan produksi secara lokal dengan semua peta sumber di tempatnya. Saya dapat men-debug potongan mana dan kemudian komponen gagal dimuat dan dipusingkan dengan impor di dalamnya. Prosesnya agak lambat, jadi bersabarlah karena Anda akan memuat ulang halaman berulang kali. Cari nama potongan Anda (dalam kasus saya component---src-pages-index-js ) dan impor ditetapkan ke sana. Masuk ke dalamnya dan amati dependensinya karena salah satunya akan gagal. Saya percaya dalam setiap kasus akan berbeda, jadi itulah mengapa Anda tidak dapat menemukan satu solusi yang baik di mana pun. Peta sumber sangat berguna karena mereka menunjukkan kepada saya lebih dari sekadar serangkaian janji umum dalam larik.

Ini bukan inti dari topik, tetapi saya akan meninggalkan detail tentang apa yang saya temukan di bawah. Ingatlah, bahwa di bawah ini khusus untuk react-leaflet saja dan jarak tempuh Anda akan bervariasi:

Jadi, begini awalnya:

import { Map, Marker, Popup, TileLayer } from 'react-leaflet'
import "leaflet-control-geocoder/dist/Control.Geocoder"
import L from "leaflet";

dan inilah tampilannya sekarang:

import { Map, Marker, Popup, TileLayer } from 'react-leaflet'
import L from "leaflet";
import "leaflet-control-geocoder/dist/Control.Geocoder"

Tentu saja, itu adalah kesalahan di pihak kami, karena plugin apa pun biasanya harus muncul setelah perpustakaan itu dicolokkan. Karena react-leaflet (menurut saya) sedikit mengubah urutan pemuatan saat menjalankan debug, masalahnya tidak terlihat selama pengembangan.

Saya baru saja men-debug Uncaught (in promise) Error: page resources for /app/ not found. Not rendering React di aplikasi saya. Dalam kasus saya, / app / adalah rute khusus klien yang berisi aplikasi react. Saya tidak memiliki masalah dalam gatsby develop , tetapi saya mendapatkan kesalahan ini saat menjalankan gatsby serve dan juga pada pembuatan produksi. Tidak ada kesalahan versi yang dilaporkan.

Ternyata masalahnya ada pada menu react-context (https://github.com/vkbansal/react-contextmenu/issues/284) yang juga ditemui @barbalex . Saya tidak tahu apakah ini adalah "kesalahan" react-contextmenu ... tampaknya perpustakaan sedang mencari pengelola dan penulis mungkin fokus pada implementasi sisi klien daripada sisi server. Saya tidak tahu apakah ada yang bisa dilakukan gatsby untuk mempermudah proses debug, pesan kesalahan tidak terlalu membantu.

@rgembalik , cara saya

Bagi saya, saya bahkan tidak bisa meniru, saya hanya melihat banyak kesalahan tesis dalam pelaporan kesalahan penjaga. jadi tidak yakin bagaimana saya akan mencari tahu

Kami mendapatkan banyak ini di Sentry dengan kesalahan ini juga untuk semua jenis halaman selain hanya "/", juga belum dapat direplikasi. Dihosting di Netlify. Saya menduga ini mungkin ada hubungannya dengan sesi aktif selama penerapan, tetapi sulit untuk diverifikasi.

@wardpeet sepertinya ada banyak penyebab potensial berbeda yang memicu kesalahan yang sama ini. Bagi kami, kami hanya melihat kesalahan ini di log Penjaga kami dan tidak pernah dapat mereproduksi. Apakah mungkin untuk memasukkan lebih banyak informasi dengan kesalahan, atau menambahkan beberapa, kesalahan yang lebih terperinci sehingga kita semua memiliki sesuatu yang lebih untuk dilakukan dalam mencoba mencari penyebabnya?

Saya baru saja mendapatkan kesalahan ini di https://www.gatsbyjs.com/ berakhir dengan halaman kosong

Saya dapat mengonfirmasi bahwa pada pemuatan halaman pertama pertama saya telah melihat kesalahan ini di gatsbyjs.com

Saya menemukan bahwa Gatsby memiliki cara khusus untuk menangani jalur url dengan garis miring. Saya tidak tahu apakah ini bisa membantu

Saya juga mengalami masalah ini.

Saya tidak dapat membagikan repositori, tetapi jika Anda mengakses halaman ini, Anda dapat melihatnya memuat SVG dengan benar. Tapi, jika saya pergi ke rute yang tidak ada, mis. Https://rocketseat.com.br/test akan menampilkan versi kode yang sudah kadaluwarsa (yang masih menggunakan gatsby-image bukan SVG) dan menunjukkan saya pesan ini di konsol:

Error: page resources for /test not found. Not rendering React

Saya menggunakan [email protected]

_edit: Saya tidak tahu mengapa, tetapi setelah saya menambahkan masalah saya di sini, masalah gambar telah terpecahkan, tetapi saya terus mendapatkan kesalahan yang sama di konsol halaman_

Sulit bagi saya untuk meniru, saya hanya melihat satu ton kesalahan ini dalam pelaporan kesalahan penjaga

@theskillwithin - sama. Ribuan di Sentry.

Saya mengalami masalah yang sama. Sangat aneh. Sepertinya ada berbagai penyebab yang memicu kesalahan ini.

Kami juga melihat kesalahan ini terjadi di berbagai browser dan di berbagai halaman. Sepertinya saya tidak bisa menghubungkan situasi kita dengan kemungkinan penyebab yang disebutkan di atas. Dan juga saya tidak bisa meniru dalam pengembangan — ini hanya terjadi pada situs web kami yang telah diterapkan.

Saya mengalami masalah yang sama. tidak dapat mereplikasi tetapi banyak kesalahan ini di penjaga. juga berbagai browser
gatsby versi 2.24.3

Ini dilaporkan semi-sering di situs produksi tempat saya menggunakan Sentry juga. Tidak dapat meniru diri saya sendiri. Menurut saya, kami membutuhkan pelaporan yang lebih baik. Apa yang aneh tentang itu adalah, pada kenyataannya, menemukan data halaman:

Karena menerima status 200, dan AFAICT, json tidak salah, saya berasumsi bahwa fetchPageDataJson() mengembalikan respons yang berhasil:
https://github.com/gatsbyjs/gatsby/blob/90e66c7fcdc7a75185bdaa336b0f9bdec9762585/packages/gatsby/cache-dir/loader.js#L137 -L151

Karena sepertinya berhasil, titik kegagalan berikutnya yang dapat saya lihat adalah memuat komponen itu sendiri:
https://github.com/gatsbyjs/gatsby/blob/90e66c7fcdc7a75185bdaa336b0f9bdec9762585/packages/gatsby/cache-dir/loader.js#L438 -L448
https://github.com/gatsbyjs/gatsby/blob/90e66c7fcdc7a75185bdaa336b0f9bdec9762585/packages/gatsby/cache-dir/loader.js#L235 -L241

Mungkin ada masalah di async-requires yang sedang ditulis. Saya membayangkan itu sebenarnya baik-baik saja, karena mereka akan ditangani oleh Webpack, dan masalahnya tampaknya terputus-putus. Jika ada masalah dengan cara file itu ditulis, itu akan menyebabkan build menjadi bom.

Jika ini adalah semacam masalah sintaks di suatu tempat di modul yang diimpor, maka saya membayangkan itu akan gagal 100% setiap saat. Mungkin ada sesuatu yang digunakan dalam modul yang tidak kompatibel dengan perangkat / browser apa pun yang memuat modul tersebut. Sulit untuk memastikannya, karena kesalahan spesifik sedang dikaburkan.

Yang saya pikir kita butuhkan adalah pemuat komponen untuk _not_ memakan kesalahan yang dihasilkan.

Memiliki Promise.resolve() sana ketika potongan tidak ada di asyncRequires berarti kesalahan yang dilemparkan akan masuk akal. Kesalahan itu juga akan terjadi pada setiap kunjungan ke halaman itu ... jadi akan mudah untuk melacak penyebabnya.

Mengembalikan null di blok catch di sana berarti kesalahan yang dilemparkan tidak masuk akal. Modul ditemukan, tetapi kesalahan terjadi selama impor dinamis. Bukankah webpack mengembalikan kesalahan dalam blok catch() dari impor dinamis? Jika tidak, mungkin ini adalah masalah yang harus ditangani dengan Webpack. Saya tahu bahwa jika saya menjalankan import() dari devtools, kesalahan dilaporkan ... apakah kesalahan dilaporkan berdasarkan ketidakmampuan / kegagalan untuk mengurai javascript yang diimpor adalah pertanyaan lain, dan akan memakan waktu beberapa pengujian tambahan dengan beberapa kode yang saya _ tahu_ tidak akan berfungsi di browser tertentu.

@wardpeet Anda menyebutkan pelaporan kesalahan yang lebih baik sebelumnya . Apakah itu sedang dikerjakan, atau apakah bantuan itu dibutuhkan?

Mengenai kompatibilitas browser, saya melihat kesalahan ini sebagian besar dihasilkan oleh perangkat seluler.

Tetapi saya juga melihat kesalahan ini dihasilkan di MacOS X menggunakan Safari, dan Windows 10 menggunakan Chrome.

Satu kesamaan adalah bahwa lalu lintas secara umum tampaknya berasal dari Facebook atau Google. Tapi itu mungkin hanya kebetulan, karena itulah yang mendorong sebagian besar lalu lintas kita.

_CATATAN: Situs yang saya kerjakan ini sebenarnya menggunakan [email protected] , jadi kode yang saya tautkan ada di tempat yang berbeda, tetapi logikanya sendiri sepertinya tidak berubah. Itu masih melakukan hal yang sama, dan potensi titik kegagalan yang telah saya identifikasi tampaknya sama._

[email protected]

Saya juga jarang melihat kesalahan pada bugsnag. Tidak jelas apakah halaman tersebut di-render atau tidak untuk saya. Berikut tumpukan bugsnag jika ada bantuan @wardpeet Menarik bahwa dalam kasus ini tampaknya telah mencoba beberapa kali. Perhatikan ini adalah salah satu dari banyak / webinar / bla ... halaman yang kita gunakan createPage () di tetapi tentu saja jika saya mencoba GET / halaman-data / ... seperti yang ditunjukkan pada foto, itu berfungsi untuk saya.

Saya akan menambahkan beberapa info tambahan ke kesalahan yang dicatat, jadi semoga kita dapat menemukan masalahnya

Saya mengalami masalah yang sama dengan halaman yang menghasilkan bug lain yang diposting di https://github.com/gatsbyjs/gatsby/issues/26706

Dalam kasus saya itu terjadi di (setidaknya) desktop chrome, dan itu hanya terjadi saat pertama kali saya memuat halaman, jika saya menekan segarkan maka semuanya dirender seperti yang diharapkan

Kemudian jika saya mencoba mengulanginya untuk pertama kali, bahkan dengan mode incognito dan mencoba menghapus setiap cache yang terpikir oleh saya, saya tidak dapat (terkadang saya bisa, meskipun sangat acak), sampai setelah beberapa saat ( beberapa hari) saya mengunjungi url dan menemukan kesalahan yang sama (yang hilang setelah menyegarkan lagi)

Jika saya mencoba menirunya dengan repo minimal yang sama yang saya gunakan untuk masalah terkait di atas, saya tidak dapat melihat kesalahan yang sama (setidaknya bukan kali saya mencoba sekarang)

Kesalahannya (dalam hal ini) terlihat karena grid pasangan bata tidak dibuat, yang dalam kasus saya menghancurkan halaman kecuali pengguna berpikir untuk menyegarkan halaman (saya curiga mereka tidak)

Sebenarnya rasanya sangat acak sehingga saya telah melihatnya selama beberapa minggu tetapi saya selalu berpikir ini adalah sesuatu dengan pc saya

Saya kehabisan npm auidit fix dan masalah telah diperbaiki untuk saya.

Berikut! Memiliki masalah yang sama juga

Halo,

Kami mengalami masalah ini juga dalam produksi saja. Kami mereproduksi bug ini 100% dari waktu url tertentu. Mari kita lihat struktur pohon public dir kita:

public
  icons
  page-data
  usages
    brainstorming
      page-data.json
    seminaries
      page-data.json

Saat kami memasukkan url ini https://domain.com/usages/brainstorming berfungsi dengan sempurna, https://domain.com/usages/seminaries juga. Jika kami memasukkan url yang tidak diketahui seperti https://domain.com/doesnotexist kami berhak memiliki halaman 404, tetapi jika kami mencoba untuk mencapai url yang cocok dengan folder sebenarnya di pohon, seperti https://domain.com/usages , kami memiliki halaman kosong ini dan kesalahan ini.

Apakah itu mungkin membunyikan bel bagi Anda?

Terbaik

@guillaumepotier apakah Anda kebetulan menggunakan nginx juga?

Saya pikir ini mungkin disebabkan oleh header respons yang salah.

@ daydream05 ya memang kami menggunakan nginx. Kami melihat di log kami beberapa 304 Header konten yang tidak diubah, dan terkadang 200 tanggapan.

menggunakan bucket AWS S3

Sama di sini, hosting di AWS S3 (dengan CloudFront CDN).

Saya kehabisan npm audit fix dan masalah telah diperbaiki untuk saya.

Menarik @ liuuuk311. Saya mencobanya di proyek kami dan mungkin itu telah menyelesaikan masalah untuk kami juga. Waktu akan menjawab, tetapi sejauh ini setelah 48 jam tidak ada kejadian di log kami.

Edit: 5 hari kemudian, masih tidak ada kejadian ...

Edit: 10 hari kemudian dan itu terjadi beberapa kali lagi, maaf untuk melaporkan. Menjalankan npm audit fix itu sendiri tampaknya tidak menyelesaikan masalah.

@wardpeet beberapa data bugsnag tambahan yang dapat membantu mendiagnosis ...

Menurut ini, sepertinya file halaman-data.json benar-benar dimuat dengan benar ...

• karena saya gagal pada hari ini, saya akan bertemu * dan menonton di sini.

Dalam kasus saya, saya memperbaiki masalah memuat polyfill.io lib ke halaman

<script src="https://polyfill.io/v3/polyfill.min.js?version=3.52.1"></script>

@pedrofsantoscom tolong jelaskan bagaimana skrip yang dimuat secara statis memecahkan masalah untuk gatsby.js?

Punya masalah yang sama kemarin. Mengosongkan cache secara lokal memperbaikinya untuk pengguna saat ini. Jadi kami membersihkan cache di Cloudflare dan sekarang kami tidak mendapatkan laporan lagi.
Menghapus cache adalah solusi kami

Kami tidak menggunakan Cloudflare, kami menggunakan AWS cloudfront CDN dan menjadi tidak valid setelah setiap penerapan. Saya telah mengalami bug secara lokal dengan menjalankan server web lokal dengan https dengan upaya pertama untuk dijalankan setelah server web dimulai dan juga di beberapa halaman yang dimuat ulang, tetapi tidak setiap saat. Saya tidak melihat pola apa pun. Itu hanya terjadi sesekali.

Kami tidak menggunakan Cloudflare, kami menggunakan AWS cloudfront CDN dan menjadi tidak valid setelah setiap penerapan. Saya telah mengalami bug secara lokal dengan menjalankan server web lokal dengan https dengan upaya pertama untuk dijalankan setelah server web dimulai dan juga di beberapa halaman yang dimuat ulang, tetapi tidak setiap saat. Saya tidak melihat pola apa pun. Itu hanya terjadi sesekali.

Itulah solusi bagi kami. Ketika kami membersihkan cache, kesalahan per jam berkurang dengan cepat dan kami tidak mendapatkan kesalahan yang sama di bugsnag setidaknya. Ini memang kesalahan yang aneh.

Saya mendapat pesan kesalahan yang sama tetapi hanya di Internet Explorer. Semua browser lain tidak menampilkan pesan kesalahan semacam ini.

Unhandled promise rejection Error: page resources for / not found. Not rendering React

Saya menelusuri masalah ini ke impor yang saya buat di komponen react saya. Dalam beberapa kasus, saya memiliki ketergantungan ke https://sap.github.io/ui5-webcomponents/ . Setelah saya menghapus dependensi tersebut, masalahnya hilang. Saya tidak dapat menjelaskan apa sebenarnya penyebab utama, tetapi ingin menunjukkan bahwa ketergantungan dalam kontrol reaksi Anda dapat menyebabkan masalah ini.

@Chaosbohne tidak dapat benar-benar membantahnya, tetapi saya bahkan akan mengatakan itu adalah masalah sub-ketergantungan. Saya kira gatsby.js tim akan mengurus manajemen ketergantungan dan keamanan, dan pada langkah pertama akan menghapus ^ dari semua versi dependensi / devDependency, berbagai macam masalah dapat dicegah.

Saya dapat mengatakan bahwa masalah ini tidak bergantung pada browser. Saya telah melihatnya di Chrome dan Safari berdasarkan log Sentry, dan di chrome 85, 86 secara lokal di mac saya.

Tidak ada solusi yang berhasil. @KyleAMews karena masalah ini kami kehilangan bisnis, dalam 3-4 hari masalah ini terjadi dan kami tidak dapat menemukan akar penyebabnya. Tolong bantu kami menemukan solusi untuk masalah ini.

@ R3coN Apakah Anda mencoba membangun kembali situs web Anda? Ketika itu terjadi pada kami, pada dasarnya kami hanya mencoba lagi (itu beberapa waktu yang lalu saya tidak ingat mengapa itu diperbaiki)

@ R3coN jika dapat membantu, berikut adalah versi paket yang kami gunakan yang berfungsi dengan baik:

    "gatsby": "2.20.36",
    "gatsby-cli": "^2.12.54",
    "gatsby-image": "^2.4.13",
    "gatsby-plugin-exclude": "^1.0.2",
    "gatsby-plugin-google-analytics": "^2.3.11",
    "gatsby-plugin-manifest": "^2.4.18",
    "gatsby-plugin-offline": "^3.2.17",
    "gatsby-plugin-react-helmet": "^3.3.10",
    "gatsby-plugin-react-svg": "^3.0.0",
    "gatsby-plugin-resolve-src": "^2.1.0",
    "gatsby-plugin-sass": "^2.3.12",
    "gatsby-plugin-sharp": "^2.6.19",
    "gatsby-plugin-use-query-params": "^1.0.1",
    "gatsby-source-filesystem": "^2.3.19",
    "gatsby-source-graphql": "^2.6.2",
    "gatsby-transformer-sharp": "^2.5.11",

@ shide1989 ya, itulah satu-satunya cara untuk memperbaikinya, Membangun kembali situs web lagi. Tetapi membangun kembali juga memperbaiki masalah selama 2-3 hari dan kemudian masalah ini muncul lagi. Kami menggunakan Gatsby CLI versi: 2.12.67 dan Gatsby versi: 2.24.47 karena Anda telah menyebutkan versi 2.20.36 dari gatsby berfungsi dengan baik untuk Anda, kami akan mencoba keberuntungan kami dengan menurunkan versi gatsby.

@ shide1989 Terima kasih atas komentarnya. Tetapi menurunkan versi membuat saya mengalami kesalahan ini ->

WebpackError: Hasil StaticQuery ini tidak dapat diambil.

Yang bekerja di versi sebelumnya 2.24.47.

menyesal mendengarnya, mungkin Anda tidak memiliki literal templat yang diberi tag graphql di file yang sama di mana hook useStaticQuery digunakan untuk mengekstrak kueri pada waktu pembuatan. (seperti yang dijelaskan di sini: https://github.com/gatsbyjs/gatsby/issues/24526)

semoga berhasil dengan itu

Tetapi saya katakan kepada Anda bahwa kode yang sama berfungsi untuk gatsby 2.24.47.

@ R3coN masalah ini mungkin juga disebabkan oleh cache statis yang tidak tepat. Jika Anda menggunakan nginx atau s3 untuk server Anda dan Anda tidak membuat halaman-data.json Anda tidak valid, maka StaticQueries Anda akan rusak setiap kali Anda mengubah data Anda.

Saya mengalami masalah ini dan ternyata saya meng-cache semua halaman-data.json. Seharusnya tidak. Mereka harus divalidasi ulang setiap permintaan

https://www.gatsbyjs.com/docs/caching/

@ daydream05 Terima kasih atas komentarnya. Ya, saya menggunakan S3 dengan CloudFront. Apakah Anda tahu cara mencapainya dengan Cloudfront?

@ daydream05 Saya sudah memiliki kontrol-cache: 'public, max-age = 0, must-revalidate' ditambahkan ke halaman-data.json dan app-data.json yang berarti bahwa halaman ini tidak disimpan dalam cache.

Saya melihat ini juga di halaman yang tidak ada (yang seharusnya memuat & melembabkan halaman 404).

Secara lokal, pengembang & produksi saya bekerja tanpa kesalahan ini, dan ketika saya memasukkan console.log selama pemeriksaan yang melempar kesalahan itu dalam produksi yang dibangun app-[hash].js , saya dapat melihat bahwa page object ada dan termasuk page.componentChunkName: ""component---src-pages-404-js" seperti yang saya harapkan.

Namun, saat aplikasi diterapkan ke gatsby cloud, kesalahan terjadi pada setiap pemuatan halaman yang tidak ada. Halaman 404 SSR akan ditampilkan di browser, tapi kemudian error muncul, jadi React tidak pernah berjalan di browser. Ketika halaman 404 dimuat secara langsung (dengan mengunjungi /404 path) itu berfungsi dengan baik, tanpa kesalahan.

Ini sulit untuk didiagnosis karena saya belum dapat mereplikasi secara lokal sejauh ini.

Menggunakan versi terbaru: "gatsby": "^2.24.91"

Hanya memposting ini di sini agar orang lain dapat menggunakan react-md untuk segera memperbaiki situs mereka, atau berharap ini bisa membantu untuk memperbaiki masalah ini di Gatsby.

Saya mengalami kesalahan yang sama di salah satu proyek saya, di mana saya menggunakan react-md
Setelah menghapus semua komponen, saya bisa menyingkirkan masalah tersebut.

Karena saya harus menerapkan untuk mendorong setiap kali menguji ini, saya belum berhasil menentukan komponen spesifik mana yang memiliki masalah ini, tetapi saya telah mempersempitnya menjadi.

import Card from "react-md/lib/Cards/Card";
import CardTitle from "react-md/lib/Cards/CardTitle";
import CardText from "react-md/lib/Cards/CardText";
import CardActions from "react-md/lib/Cards/CardActions";
import { TextField, Button, Snackbar } from "react-md";

Saya akan memperbarui posting blog saya tentang masalah ini jika saya punya waktu untuk menggali lebih dalam.

Mengenai 404 halaman, saya dapat mengonfirmasi masalah @aMoniker karena pola perilaku yang sama terjadi pada saya.

Secara lokal, pengembangan dan produksi build berfungsi dengan baik dengan halaman 404 , tetapi ketika diterapkan ke Gatsby Cloud, saya mendapatkan masalah di setiap halaman yang tidak diketahui kecuali jalur /404 .

Saya juga mengalami kesalahan ini dan memperbaikinya dengan membersihkan cache browser. Namun akan lebih baik untuk menemukan solusi yang tidak mensyaratkan itu, karena kami tidak dapat memaksa semua penggunaan kami untuk melakukan ini.

@ dejavu1987 kami tidak menggunakan react-md pada proyek yang mengalami masalah ini.

@MaciekBaron Saya telah mereproduksi kesalahan secara lokal dengan membersihkan cache browser beberapa kali dan memuat ulang halaman setelah setiap pembersihan.

Ini sepertinya masalah cache seperti yang saya sebutkan sebelumnya. Jika header cache Anda disetel dengan benar, masalahnya mungkin ada pada pekerja layanan.

Mungkin coba plugin ini?
https://www.npmjs.com/package/gatsby-plugin-remove-serviceworker

Hei, saya juga mengalami masalah ini. Dalam mengembangkan semuanya berfungsi dengan baik tetapi ketika saya menjalankan gatsby build dan menerapkan direktori publik ke penghosting web saya, maka halaman gagal berfungsi karena pesan kesalahan ini.

Saya sangat ingin tahu dan melihat ke direktori data halaman publik. Saya menemukan bahwa direktori halaman tertentu ada tetapi tidak dalam huruf kecil, sebaliknya direktori menggunakan huruf kapital. Itulah masalah saya mendapat pesan kesalahan.

Setelah itu saya mengubahnya menjadi huruf kecil di awal dan berfungsi dengan baik di prod. Saya pikir ini terjadi karena saya mengubah nama halaman sebelumnya & mungkin ada sesuatu yang di-cache di sini?

Saya juga mengalami masalah ini. Saya telah menemukan metode untuk memperbaiki masalah ini. Tapi saya pikir itu belum memperbaiki masalah sebenarnya.

Sekarang, izinkan saya menjelaskan cara memperbaikinya.

Masalah ini ditemukan di lingkungan pengujian atau produksi, seperti yang dikatakan semua di atas, tidak akan berkembang biak dalam pengembangan. Bahkan dalam pengujian atau produksi, itu tidak terjadi setiap saat. Dan saya menemukan bahwa semua skrip dimuat sebelumnya dan dieksekusi secara tidak sinkron. Jadi saya kira itu mungkin disebabkan oleh perintah eksekutif skrip.

Saat saya memperlambat jaringan di Jaringan, seperti ditetapkan sebagai 3G fast , masalah hampir selalu terjadi. Ini mengkonfirmasi dugaan saya.

Untuk memvalidasi tebakan saya, saya telah mengubah proses render HTML di gatsby-ssr.js untuk mengatur semua script tanpa "async" , sebagai berikut:

exports.onPreRenderHTML = ({ replacePostBodyComponents, getPostBodyComponents }) => {
    const postBodyComponents = getPostBodyComponents()
    postBodyComponents.forEach((component) => {
      if(component.type === 'script' && component.props) {
        delete component.props.async
      }
    })
    replacePostBodyComponents(postBodyComponents)
  }

Untungnya, itu berhasil.

Meskipun cara ini dapat membantu memperbaiki masalah, menurut saya ini bukan cara yang baik untuk melakukannya. Sepertinya melanggar fitur gatsby. Apakah skrip mengeksekusi desain secara asinkron menjadi seperti ini?

Semoga cara ini bisa menyelesaikan semua masalah Anda juga.

Masalah ini ditemukan di lingkungan pengujian atau produksi, seperti yang dikatakan semua di atas, tidak akan berkembang biak dalam pengembangan. Bahkan dalam pengujian atau produksi, itu tidak terjadi setiap saat. Dan saya menemukan bahwa semua skrip dimuat sebelumnya dan dieksekusi secara tidak sinkron. Jadi saya kira itu mungkin disebabkan oleh perintah eksekutif skrip.

Meskipun cara ini dapat membantu memperbaiki masalah, menurut saya ini bukan cara yang baik untuk melakukannya. Sepertinya melanggar fitur gatsby. Apakah skrip mengeksekusi desain secara asinkron menjadi seperti ini?

Saya pikir Anda benar, saya mengalami masalah ini kembali karena alasan yang aneh.
Yang terbaru memang liar, tetapi ketika saya menghubungkannya dengan jawaban Anda, itu masuk akal.

Jadi, baru-baru ini saya menambahkan komponen ikon font ke komponen tata letak saya, dan itu mereproduksi masalah ini.
Hal penting yang perlu diperhatikan adalah, ikon font telah digunakan di komponen bersarang dalam lainnya selama ini, dan tidak pernah menyebabkan masalah, hanya jika berada di tingkat tata letak yang merupakan komponen pertama yang dipanggil dari komponen halaman mana pun.

Saya mungkin salah, tetapi ini bisa menjadi skenario yang baik untuk mencari tahu penyebab sebenarnya.

@ dejavu1987 Setuju dengan Anda. Mungkin Anda telah memberikan skenario yang baik untuk mencari tahu penyebab sebenarnya.

Selanjutnya, saya bertanya-tanya apakah cocok untuk memuat dan mengeksekusi skrip dengan async , karena webpack membagi kode menjadi beberapa bagian tetapi potongan tersebut mungkin memiliki ketergantungan.

Masalah utama tampaknya adalah Gatsby menelan kesalahan selama pemuatan halaman dan hanya melaporkan pesan page resources for / not found. Not rendering React sangat umum, itulah sebabnya ada begitu banyak penyebab potensial yang dilaporkan di utas ini.

Masalah saya ternyata Mobx 5 tidak mendukung IE11, dan sementara Mobx memberikan pesan kesalahan yang bagus untuk ini, yang saya dapatkan hanyalah pesan "sumber daya halaman tidak ditemukan" dari Gatsby yang agak menyesatkan.

Saya dengan rendah hati menyarankan sebagai penyelesaian masalah ini untuk melaporkan pesan kesalahan asli yang menyebabkan pemuatan halaman gagal. @wardani

Yang memperbaikinya untuk saya adalah bahwa saya telah menyiapkan S3 untuk mengembalikan 200 pada halaman 404. Ketika saya mengubahnya untuk mengembalikan kode status 404 itu berhasil.

Ya, saya menemukan ini juga. Namun, masalah saya lebih luas… Saya melakukan cache yang tidak tepat pada hasil Cloudfront 404. Alasan saya mendapatkan hasil 404 antara Cloudfront dan S3 adalah karena penerapan ke S3 melalui CodePipeline. Saya yakin membuka ritsleting file Build Artifact ZIP - tetapi tidak melakukannya dalam urutan tertentu. Jadi untuk beberapa menit Anda dapat memiliki file .HTML baru yang menunjuk ke file .JS baru (dengan hashes baru) yang belum ada. Apa pun yang menangani caching untuk file aset berciri Anda tidak boleh meng-cache pada hasil 404 karena ini hanya dapat diperbaiki dengan membersihkan cache CDN Anda.

Adakah yang tahu cara memastikan file HTML diterapkan ke S3 terakhir?

David
https://ewebinar.com

Pada 21 Okt 2020, pukul 12.40, Vince P. [email protected] menulis:

@ R3coN https://github.com/R3coN masalah ini mungkin juga disebabkan oleh cache statis yang tidak tepat. Jika Anda menggunakan nginx atau s3 untuk server Anda dan Anda tidak membuat halaman-data.json Anda tidak valid, maka StaticQueries Anda akan rusak setiap kali Anda mengubah data Anda.

Saya mengalami masalah ini dan ternyata saya meng-cache semua halaman-data.json. Seharusnya tidak. Mereka harus divalidasi ulang setiap permintaan

https://www.gatsbyjs.com/docs/caching/ https://www.gatsbyjs.com/docs/caching/
-
Anda menerima ini karena Anda berlangganan utas ini.
Balas email ini secara langsung, lihat di GitHub https://github.com/gatsbyjs/gatsby/issues/19618#issuecomment-713298516 , atau berhenti berlangganan https://github.com/notifications/unsubscribe-auth/AA3SHT55MXZTXQUAXH5ZUY3SLZQ4VANCNFSMIK3 .

Saya dapat menambahkan bahwa saya telah mereproduksi masalah dengan Chrome Lighthouse Audit pada pengujian seluler, dengan pengujian PWA dan tanpa pengujian. Saya yakin pengujian seluler menggunakan batas jaringan dan cpu, jadi skrip asinkron memuat rusak, atau salah satu dari 30 gagal ... bisa jadi situasi yang cukup sering.

Saya bekerja dengan 3d, dan bahkan pada localhost dengan webpack dan gatsby.js , memuat ulang halaman cukup sering mengakibatkan permintaan jaringan yang gagal untuk model statis gtlf file. Salah satunya gagal - semua aplikasi rusak (jika tidak ada pengaturan ErrorBoundary).

Saya kira di sini bisa menjadi pola yang sama, tetapi tanpa penanganan kesalahan yang tepat.

Saya menggunakan S3 dan CloudFront untuk produksi. Saya memiliki masalah serupa tetapi dalam kasus saya, saya mendapatkan kesalahan Can't render React di konsol hanya di Cloudfront. Ini mulai terjadi setelah mengubah file pada produksi S3. Yang mengejutkan saya, masalah diselesaikan setelah menjalankan kembali mercusuar untuk asal produksi.

Ini hanya terjadi di perangkat saya dalam mode normal. Dalam kasus saya, membersihkan seluruh cache, cookie, penyimpanan lokal, penyimpanan sesi, dan pekerja layanan tidak membantu sebelumnya.

Jadi jika Anda membuat profil asal produksi Anda dengan mercusuar dan file diubah, masalah ini juga dapat terjadi (Dalam kasus saya, itu)

Maksud saya adalah saya dapat mereproduksinya dengan mercusuar cukup banyak 1 dari 10, dan penyebaran terakhir sudah lama sekali.

Saya rasa gatsby tidak akan dapat menyelesaikan masalah ini, karena ini terjadi pada semua orang tetapi alasannya berbeda. Saya terlalu sering mendapatkan halaman kosong atau setiap kali saya mengubah sesuatu di halaman gatsby backend menjadi kosong dan membuat kesalahan, dan kesalahan itu juga berbeda setiap saat. Saya pikir kita harus berhenti menggunakan gatsby dan beralih ke kerangka kerja lain yang dapat diandalkan.

Saya bisa memperbaiki kesalahan jika ada cara untuk mereproduksinya, tetapi tidak ada. Kesalahan ini terjadi secara acak, terkadang terjadi sehari setelah saya menerapkan, Terkadang terjadi 3-4 hari setelah penerapan. Tapi itu terjadi.

@antoinerousseau Apakah Anda menemukan sesuatu? Adakah yang bisa memberi tahu saya langkah demi langkah cara men-debug masalah ini setidaknya? Saya telah mencoba semua hal dari pihak saya tetapi 1-2 hari setelah menerapkan situs web rusak. Adakah yang bisa memberi tahu saya cara mengetahui kapan masalah ini akan terjadi karena bagi saya itu terjadi terlalu acak?

Yang memperbaikinya untuk saya adalah bahwa saya telah menyiapkan S3 untuk mengembalikan 200 pada halaman 404. Ketika saya mengubahnya untuk mengembalikan kode status 404 itu berhasil.

S3 atau Cloudfront?

Dalam kasus saya, masalahnya ada di halaman 404, digunakan secara default oleh Azure. Itu adalah kesalahan pemblokiran dan satu-satunya hal yang dapat saya lihat di konsol adalah
Error / page resources for / not found. Not rendering React

Sejak saya mulai menggunakan 404 tersuai - masalah hilang.

Saya mendapatkan hal yang sama ketika saya menerapkan aplikasi di Netlify .. Secara Lokal Gatsy Build dan Gatsby Serve bekerja dengan baik .. Ini bahkan lebih aneh ..

@atapas dapatkah Anda menghubungi dukungan Netlify? Mungkinkah mereka dapat mengklarifikasi sesuatu dari pihak mereka?

@atapas dapatkah Anda menghubungi dukungan Netlify? Mungkinkah mereka dapat mengklarifikasi sesuatu dari pihak mereka?

Ya saya lakukan. Terima kasih!

Mungkin, jejak tumpukan yang lebih baik atau pesan kesalahan yang jelas akan membantu di sini. Bagaimanapun, terima kasih atas tanggapannya.

@atapas Saya bukan anggota tim, hanya menderita bug yang sama seperti Anda.

Saya mendapatkan hal yang sama ketika saya menerapkan aplikasi di Netlify .. Secara Lokal Gatsy Build dan Gatsby Serve bekerja dengan baik .. Ini bahkan lebih aneh ..

Saya telah menemukan solusi dalam konteks yang sama sekali berbeda. Saya mendapatkan kesalahan karena Netlify mengabaikan variabel env yang telah saya setel untuk Auth0 agar berfungsi di aplikasi saya,

domain: process.env.AUTH0_DOMAIN,
clientID: process.env.AUTH0_CLIENTID,
redirectUri: process.env.AUTH0_CALLBACK,

Saya kemudian membaca tentang "Terapkan tanpa variabel sensitif" dari sini dan memperbaikinya seperti yang disebutkan di dokumen.

Saya terkejut dengan kesalahan yang saya dapatkan dan solusinya masuk ke dalam .. tetapi senang itu berhasil.

@atapas Saya bukan anggota tim, hanya menderita bug yang sama seperti Anda.

@ JustFly1984 , Jangan khawatir saya benar-benar ingin Terima Kasih. Saya melihat ke dokumen Netlify dan dapat menemukan solusinya seperti yang disebutkan dalam komentar di atas.

Saya mendapatkan ini hanya di Chrome. Safari berfungsi dengan baik. Saya baru saja menambahkan plugin offline dan manifes ke proyek saya. Saya tidak dapat mereproduksinya dengan Gatsby develop atau dengan gatsby build & gatsby serve secara lokal. Saya menjadi tuan rumah di Netlify.

Bagi saya, blok kode di luar komponen React saya serta referensi variabel global dalam komponen React menyebabkan kesalahan. Menghapusnya memperbaiki masalah.

let deferredprompt = null;
let updateAvailable = false;
if (
  typeof window !== "undefined" &&
  window.hasOwnProperty("BeforeInstallPromptEvent")
) {
  window.addEventListener("beforeinstallprompt", (event) => {
    deferredprompt = event;
    event.preventDefault();
  });
}

if (typeof window !== "undefined" && window.isUpdateAvailable) {
  window.isUpdateAvailable.then(
    (isAvailable) => (updateAvailable = isAvailable)
  );
}