Gatsby: Kesalahan "StoreStateProvider" yang ambigu untuk semua perintah gatsby

Dibuat pada 27 Nov 2019  Β·  58Komentar  Β·  Sumber: gatsbyjs/gatsby

Deskripsi

Setelah memperbarui Gatsby dari 2.17.7 ke 2.18.4, menjalankan segala jenis perintah gatsby menyebabkan kesalahan. Secara harfiah tidak ada konteks.

> gatsby clean

The above error occurred in the <StoreStateProvider> component:
    in StoreStateProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.
Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.
> gatsby build

The above error occurred in the <StoreStateProvider> component:

...

Lingkungan Hidup

Sayangnya, saya tidak dapat menjalankan gatsby info --clipboard , karena macet dengan kesalahan StateStoreProvider sama seperti perintah lainnya. Saya mengembalikan versi Gatsby saya lagi dan menjalankan perintah ini. Perhatikan bahwa versi Gatsby pada keluaran di bawah ini salah .

  System:
    OS: Windows 10
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
  Binaries:
    npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD
  Languages:
    Python: 2.7.16 - C:\Python27\python.EXE
  Browsers:
    Edge: 44.18362.267.0
  npmPackages:
    gatsby: ^2.17.7 => 2.17.7
    gatsby-source-apiserver: ^2.1.4 => 2.1.4
stale? needs reproduction bug

Komentar yang paling membantu

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Semua 58 komentar

Saya mengalami masalah yang sama setelah pembaruan dari 2.17.10 ke 2.18.4

Terima kasih telah melaporkan!

Bisakah Anda juga mencoba mengupgrade gatsby-cli? Jika ini tidak membantu, akan sangat membantu jika Anda dapat memberi kami repositori reproduksi.

Terima kasih! : purple_heart:

Saya sebenarnya tidak menginstal CLI secara global. Proyek ini mengandalkan perintah npm run <command> yang pada gilirannya mengeksekusi gatsby <command> , menggunakan versi Gatsby yang diinstal secara lokal.

Dengan menggunakan pola itu, orang tidak perlu membuang sampah sembarangan di mesin mereka dengan ketergantungan global. (Yang mungkin menjadi jelek jika Anda mengerjakan beberapa proyek, yang berpotensi membutuhkan versi berbeda)

Saya memiliki masalah yang sama sebelumnya hari ini, yang berhasil bagi saya adalah memperbarui react, react-dom dan gatsby, menghapus node_modules dan package-lock.json. Akhirnya saya menjalankan npm install lagi dan semuanya bekerja dengan baik

Memperbarui react dan react-dom , serta Gatsby, tampaknya berhasil. Bukankah Gatsby harus mencantumkan versi React yang benar yang kompatibel dengannya?

Kemarin saya telah menghabiskan setengah hari hanya untuk mengetahui bahwa Dalam kasus saya gatsby build / develop berfungsi dengan baik ketika deps dipasang dengan benang.

Sepertinya itu ada hubungannya dengan masalah kompatibilitas antara React dan Gatsby. Jika Anda menginstal dependensi dari awal (tanpa file kunci) manajer paket Anda (baik benang atau npm) hanya akan mendapatkan versi terbaru (diizinkan oleh pembatasan di package.json).

Dalam kasus saya, versi react dikunci di package-lock.json , oleh karena itu tidak diperbarui bersama Gatsby bahkan pada instalasi baru.

Saya mengalami masalah yang sama. Saya telah memperbarui gatsby, gatsby-cli, react dan react-dom tanpa hasil. Apakah ada solusi yang pasti?

EDIT: Saya menghapus gatsby dan gatsby-cli dan menginstalnya kembali secara individual dan tampaknya telah memperbaikinya. Masalah aneh.

Saya mengalami masalah ini. Itu karena ada dua versi react yang diinstal. Jalankan npm ls react untuk melihatnya. Saya memiliki versi react yang ditentukan dalam package.json saya, dan sepertinya gatsby / gatsby-cli 2.18.5 memiliki versi react yang berbeda.

Saya mengetahui masalah tersebut melalui halaman ini .

Masih mencoba memperbaiki masalah ...

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Meskipun saya tidak diblokir untuk saat ini, saya masih memiliki kekhawatiran:
1) Dua versi react masih ada? (Saya tidak yakin), meskipun sekarang versinya sama
2) Apakah pembaruan gatsby di masa mendatang akan menyebabkan masalah ini lagi?

Tidak punya jawaban, tapi menyuarakan keprihatinan saya untuk tim gatsby untuk dipertimbangkan.

Saya cukup yakin npm ls hanya alat untuk membantu Anda memahami pohon ketergantungan proyek Anda. Kemungkinan hanya ada satu salinan react yang diinstal. Anda bisa masuk ke folder node_modules untuk memastikan ...

Saya mengalami masalah yang sama setelah memperbarui gatsby. Saya menurunkan versi ke versi saya sebelumnya "gatsby": "^ 2.13.73" yang merupakan beberapa versi sebelumnya tetapi memperbaiki masalah.

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Ini berhasil untuk saya. Terima kasih!

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Ditto ke atas, solusi ini memperbaiki banyak hal untuk saya juga.

Saya telah berhasil menyelesaikan masalah dengan mengupgrade react dan react-dom ke 16.12.0 dan kemudian meningkatkan gatsby ke 2.18.7.

Penting: Pastikan Anda menjalankan "gatsby clean" setelah mengupgrade react, react-dom dan gatsby.

Mengupgrade gatsby ke 2.18.7 seperti yang disarankan oleh @clarmso melakukan trik untuk saya (reaksi di 16.12.0).

Juga mengalami masalah yang sama. Diperbarui react dan gatsby tetapi masih mengalami masalah yang sama. Juga mencoba untuk membersihkan setelah pembaruan, masalah tetap ada.

"gatsby": "^ 2.18.11"
"react": "^ 16.12.0"
"react-dom": "^ 16.12.0"

Juga mengalami masalah yang sama. Diperbarui react dan gatsby tetapi masih mengalami masalah yang sama. Juga mencoba untuk membersihkan setelah pembaruan, masalah tetap ada.

"gatsby": "^ 2.18.11"
"react": "^ 16.12.0"
"react-dom": "^ 16.12.0"

Sama untuk ku. Sampai kemarin bekerja dengan baik

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Ini berhasil juga untuk saya. Apakah ini sedang dikerjakan untuk perbaikan permanen?

Karena pembaruan ini, saya sekarang mendapatkan peringatan yang lebih aneh dari StoreStateProvider dan hal-hal acak di Contentful yang kembali sebagai null meskipun ada.

Tidak yakin apa yang terjadi tetapi saya harus menyimpannya di cabang untuk saat ini

Juga mengalami masalah yang sama. Diperbarui react dan gatsby tetapi masih mengalami masalah yang sama. Juga mencoba untuk membersihkan setelah pembaruan, masalah tetap ada.

"gatsby": "^ 2.18.11"
"react": "^ 16.12.0"
"react-dom": "^ 16.12.0"

Folder node_modules & file package-lock.json dihapus. Jalankan npm install dan semuanya baik-baik saja.

Pengalaman saya adalah kombinasi dari komentar di atas. Karena saya menghapus folder node_modules dan saya memiliki plugin gatsby, npm tidak akan berfungsi. Pemasangan benang akhirnya memperbaikinya.

Saya memperbaiki masalah ini dengan menginstal ulang react , react-dom dan gatsby . (https://github.com/gatsbyjs/gatsby/issues/19827#issuecomment-559898690)

sebelum

react v16.11.0
react-dom v16.11.0
gatsby v2.17.11

setelah

react v16.12.0
react-dom v16.12.0
gatsby v2.18.12

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Terima kasih, ini berhasil untuk saya 🍾

Secara pribadi saya harus menghapus folder node_modules dan package-lock.json
Kemudian, saya meningkatkan react , react-dom dan gatsby :

"react": "^16.12.0",
"react-dom": "^16.12.0",
"gatsby": "^2.18.17",

Jangan lupa untuk memperbarui gatsby-cli ke versi terbaru dan menjalankan gatsby clean
Setelah itu, gatsby develop bekerja seperti jimat!

Saya menemukan bahwa masalah hanya terjadi ketika logger gatsby default digunakan. Logger tertentu yang akan digunakan dikontrol melalui proses GATSBY_LOGGER env . Masalah ini tidak dapat direkonstruksi jika logger default diubah misalnya dengan json logger.

export GATSBY_LOGGER=["json"]
npm i && npm run start 

Beralih ke yurnalist / json gatsby memperbaiki masalah logger untuk saya

export GATSBY_LOGGER=["yurnalist"]

Saya mengalami masalah ini hari ini ketika menjalankan gatsby develop pada proyek yang lebih lama (terakhir kali menjalankan gatsby develop adalah di Musim Gugur)

Saya memperbaiki dengan melakukan kombinasi dari saran di atas (sangat membantu!).

Dapat mengonfirmasi bahwa ini berhasil:

  1. gatsby clean - dimulai dengan ini untuk melihat apakah sudah teratasi
  2. menghapus node_modules
  3. npm install

Itu tidak terselesaikan pada saat ini jadi saya mengikuti saran untuk melakukan ini:

  1. npm uninstall react react-dom gatsby
  2. npm install react react-dom gatsby

Ini bekerja dengan sempurna.

menghapus paket-lock.json
node_modules dihapus
lari npm i

bekerja untuk saya: D

Saya memperbaiki masalahnya! Saya menggunakan npm untuk menghapus instalasi, kemudian menginstal (ulang) react , react-dom , dan gatsby . Saya melakukannya dalam urutan yang tepat (saya tidak percaya pemesanan akan menjadi masalah, tetapi FYI jika itu penting).

npm ls react menunjukkan dua versi, tetapi keduanya sama dan ditandai sebagai "deduped":

[email protected] <redacted the filepath>
β”œβ”€β”¬ [email protected]
β”‚ └─┬ [email protected]
β”‚   └── [email protected]  deduped
└── [email protected]

Terima kasih atas solusinya! Ini adalah penghalang utama bagi saya. Awalnya tidak berhasil, tetapi saya menginstal ulang gatsby-cli juga. Setelah itu, semuanya berfungsi dengan baik.

Deskripsi

Setelah memperbarui Gatsby dari 2.17.7 ke 2.18.4, menjalankan segala jenis perintah gatsby menyebabkan kesalahan. Secara harfiah tidak ada konteks.

> gatsby clean

The above error occurred in the <StoreStateProvider> component:
    in StoreStateProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.
Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.
> gatsby build

The above error occurred in the <StoreStateProvider> component:

...

Lingkungan Hidup

Sayangnya, saya tidak dapat menjalankan gatsby info --clipboard , karena macet dengan kesalahan StateStoreProvider sama seperti perintah lainnya. Saya mengembalikan versi Gatsby saya lagi dan menjalankan perintah ini. Perhatikan bahwa versi Gatsby pada keluaran di bawah ini salah .

  System:
    OS: Windows 10
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
  Binaries:
    npm: 6.9.0 - C:\Program Files\nodejs\npm.CMD
  Languages:
    Python: 2.7.16 - C:\Python27\python.EXE
  Browsers:
    Edge: 44.18362.267.0
  npmPackages:
    gatsby: ^2.17.7 => 2.17.7
    gatsby-source-apiserver: ^2.1.4 => 2.1.4

Saya menghadapi masalah yang sama! Solusi yang membantu saya adalah menginstal benang dan menambahkan bidang resolusi ke package.json Anda
https://yarnpkg.com/lang/en/docs/selective-version-resolutions/

Kesalahan ini disebabkan oleh gatsby-cli internal menggunakan react dengan ink untuk membuat antarmuka baru. Pencocokan versi yang tidak tepat antara versi proyek react dan yang dibutuhkan oleh gatsby adalah penyebabnya.

Menginstal gatsby-cli secara global (yang kami rekomendasikan) akan mencegah masalah ini sejauh yang saya tahu. Meskipun demikian, menutup ini karena tidak ada apa pun yang perlu diperbaiki di gatsby sehubungan dengan ini.

Terima kasih banyak dari kalian semua! πŸ’œ

Kemarin saya telah menghabiskan setengah hari hanya untuk mengetahui bahwa Dalam kasus saya gatsby build / develop berfungsi dengan baik ketika deps dipasang dengan benang.

Secara efektif, menggunakan benang juga memecahkan masalah saya

Hanya menjalankan npm update menyelesaikan masalah saya

Menginstal gatsby-cli secara global (yang kami rekomendasikan) akan mencegah masalah ini sejauh yang saya tahu. Meskipun demikian, menutup ini karena tidak ada yang perlu diperbaiki di gatsby terkait hal ini.

Ini tidak berhasil untuk saya. Mengalihkan logger ke yurnalist atau json seperti yang disebutkan di atas. Saya juga menghapus folder public , .cache , dan node_modules .

Output dari versi gatsby:

gatsby -v
Gatsby CLI version: 2.8.27
Gatsby version: 2.18.25

Berikut dependensi saya jika penasaran:

    "dependencies": {
        "@emotion/core": "^10.0.27",
        "@emotion/styled": "^10.0.27",
        "gatsby": "^2.18.25",
        "gatsby-image": "^2.2.39",
        "gatsby-plugin-emotion": "^4.1.21",
        "gatsby-plugin-google-analytics": "^2.1.33",
        "gatsby-plugin-manifest": "^2.2.37",
        "gatsby-plugin-netlify": "^2.1.31",
        "gatsby-plugin-offline": "^3.0.32",
        "gatsby-plugin-react-helmet": "^3.1.21",
        "gatsby-plugin-sharp": "^2.3.13",
        "gatsby-plugin-web-font-loader": "^1.0.4",
        "gatsby-remark-images": "^3.1.42",
        "gatsby-remark-prismjs": "^3.3.30",
        "gatsby-remark-reading-time": "^1.1.0",
        "gatsby-source-filesystem": "^2.1.46",
        "gatsby-transformer-remark": "^2.6.48",
        "gatsby-transformer-sharp": "^2.3.13",
        "prism-themes": "^1.3.0",
        "prismjs": "^1.19.0",
        "prop-types": "^15.7.2",
        "react": "^16.12.0",
        "react-dom": "^16.12.0",
        "react-helmet": "^5.2.1",
        "typeface-karla": "0.0.72"
    },

Inilah kesalahan yang saya terima:

gatsby develop

 ERROR 

The above error occurred in the <StoreStateProvider> component:
    in StoreStateProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.


 ERROR 

Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.


 ERROR 

UNHANDLED REJECTION Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.



  Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could   happen for one of the following reasons:
  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
  See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.

  - react.development.js:1590 resolveDispatcher
    [project]/[gatsby]/[react]/cjs/react.development.js:1590:13

  - react.development.js:1618 useState
    [project]/[gatsby]/[react]/cjs/react.development.js:1618:20

  - context.js:17 StoreStateProvider
    [project]/[gatsby]/[gatsby-cli]/lib/reporter/loggers/ink/context.js:17:41

  - react-reconciler.development.js:6036 renderWithHooks
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:6036:18

  - react-reconciler.development.js:8570 mountIndeterminateComponent
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:8570:13

  - react-reconciler.development.js:9938 beginWork$1
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:9938:16

  - react-reconciler.development.js:11563 Object.invokeGuardedCallbackImpl
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:11563:10

  - react-reconciler.development.js:11740 invokeGuardedCallback
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:11740:31

  - react-reconciler.development.js:15778 beginWork$$1
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:15778:7

  - react-reconciler.development.js:14696 performUnitOfWork
    [project]/[react-reconciler]/cjs/react-reconciler.development.js:14696:12

Untuk developer yang putus asa mencari masalah yang seharusnya tidak ada sejak awal, cukup:

-hapus folder node_modules
-hapus package.lock.json
-jalankan npm i

Setelah mendapatkan kasus reproduksi untuk itu:

Ini tampaknya berasal dari kasus dengan pemasangan npm bahwa versi yang ditentukan pengguna dari react pemasangan di node_modules , sedangkan versi gatsby-cli dari react akan dipasang dalam node_modules/gatsby/node_modules .

Karena ink tampaknya dipasang di node_modules , react impornya akan menggunakan impor yang berbeda dari gatsby-cli yang mengarah ke kasus:

  1. Anda mungkin memiliki lebih dari satu salinan React di aplikasi yang sama
    Lihat https://fb.me/react-invalid-hook-call untuk tips tentang cara men-debug dan memperbaiki masalah ini.

Dan https://reactjs.org/warnings/invalid-hook-call-warning.html#duplicate -react menjelaskan ini dengan cukup baik, tetapi hanya saran di sana (untuk menggunakan yarn resolutions tidak akan berfungsi karena ini adalah masalah dengan bagaimana npm tampaknya memutuskan node_modules struktur dan bukan benang)

Satu-satunya solusi (sangat hacky saat itu) yang muncul di benak saya saat ini adalah mengganti resolusi modul Node.js dan hardcode react menjadi yang ditentukan oleh gatsby-cli . Mungkin tidak masalah untuk melakukannya (begitulah cara PnP diimplementasikan setidaknya di yarn v1)

Setelah beberapa pemikiran lagi - opsi lainnya adalah menggunakan createRequireFromPath dari gatsby-core-utils (https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-core-utils/README .md # createrequirefrompath) dan gunakan itu di gatsby-cli untuk memuat versi yang sama dari react seperti yang dilakukan ink (ini jauh lebih sedikit hacky dan dengan sedikit kemungkinan masalah potensial yang akan datang dari resolusi modul Node.js yang berlebihan) .

Satu-satunya masalah adalah jika kita menggunakan komponen pihak ketiga ink ( ink-spinner hanya satu yang kita gunakan sekarang) dan itu akan diinstal di direktori yang berbeda dari ink .

Kami dapat mengatasi masalah potensial tersebut dengan menjual ink-spinner di dalam gatsby-cli dan memastikan untuk tidak menggunakan komponen pihak ke-3 sebagai paket (dan men-vendor semuanya)

--- diedit:
perlu berhati-hati tentang di atas - ink membutuhkan node >= 16.8.0 jadi kita perlu memastikan bahwa kita tidak menggunakan fitur dari react >= 16.8.1 dan seterusnya di gatsby-cli - jadi diperlukan lebih banyak penelitian, tetapi itu menjanjikan

Perbarui: rute createRequireFromPath tidak akan berfungsi, karena npm tidak bisa "dengan benar" menyelesaikan node_modules hierarki yang diberikan dependencies dan peerDependencies disediakan oleh ink dan gatsby-cli .

Perubahan "Cepat" adalah menurunkan persyaratan versi react (https://github.com/gatsbyjs/gatsby/pull/21522) ke jumlah skenario yang lebih rendah tempat masalah ini akan terjadi.

Tapi itu tidak memperbaiki ini sepenuhnya. Untuk itu kami kemungkinan akan membundel appropiate react versi di gatsby-cli untuk mengatasi npm ketidakmampuan untuk membuat node_modules hierarki dengan benar (atau mengganti resolusi modul Node.js, tetapi ini adalah peretasan yang dapat memiliki konsekuensi yang tidak terduga jadi saya ingin menghindari melakukan itu jika ada solusi lain)

Pembaruan lain - kami membuat beberapa pembaruan pada gatsby untuk membatasi proyek yang terpengaruh olehnya - itu diterbitkan dalam [email protected] - tetapi mungkin masih mengharuskan Anda untuk mengatur ulang / menghapus package-lock.json .

Jika itu masih tidak menyelesaikan masalah - kemungkinan Anda memiliki react / react-dom disematkan di package.json dan versinya lebih rendah dari [email protected] - kami belum memiliki perbaikan untuk itu tetapi sedang memeriksanya sebagai langkah selanjutnya - solusi yang mungkin adalah menggunakan yarn alih-alih npm untuk saat ini (belum diverifikasi).

Jika ada yang tertarik dengan hal-hal teknis, silakan periksa komentar di Permintaan Tarik awal Saya mencoba memperbaikinya - https://github.com/gatsbyjs/gatsby/pull/21508#issuecomment -586753917 dan rencananya sekarang adalah menggunakan beberapa bundler (mungkin microbundle ) untuk memaketkan react dalam gatsby-cli sehingga tidak mencoba menggunakan react dari node_modules dan hanya akan memiliki ini disertakan langsung dalam gatsby-cli )

Saya mencoba banyak komentar ini, tetapi sebagai seseorang yang belum menggunakan npm untuk bagian mana pun dari proses tersebut, saya pikir saya akan menulis apa yang secara khusus berhasil untuk saya.

Setup Saya:

Win10, Benang diinstal melalui .msi, Gatsby melalui yarn global . Menggunakan yarn untuk semua proyek Gatsby.

Masalah:

Setiap gatsby {command} akan menghasilkan kesalahan StoreStateProvider , tetapi npx gatsby {command} bekerja.

Larutan:

  1. Hapus .cache dan /node_modules jika ada.
  2. Konfirmasikan react dan react-dom diperbarui, "^16.13.0" pada tulisan ini.
  3. Jalankan yarn global remove gatsby gatsby-cli untuk menghapus CLI yang rusak.
  4. Jalankan yarn global add gatsby gatsby-cli untuk menginstal ulang CLI.
  5. Jalankan gatsby -v atau gatsby {command} dan itu akan berhasil.

Keluaran:

> gatsby -v
Gatsby CLI version: 2.9.0
Gatsby version: 2.19.23

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! πŸ’ͺπŸ’œ

Meskipun ini tidak memiliki banyak aktivitas, saya rasa tidak basi

Saya mengalami masalah yang sama, yang saya lakukan adalah menghapus json.lock saya dan menjalankan perintah benang untuk memperbarui dependensi. dan semuanya kembali berfungsi normal.

Saya mengalami masalah yang sama dengan yang saya selesaikan dengan menghapus folder "node_modules" dan file "package-lock.json" lalu perintah "npm install".

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 ramah lingkungan kami (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! πŸ’ͺπŸ’œ

: little_frowning_face: Saya masih menggunakan yurnalist sebagai logger default saya. Saya tidak pernah melihat pembaruan di sini bahwa ini telah diperbaiki.

Untuk developer yang putus asa mencari masalah yang seharusnya tidak ada sejak awal, cukup:

-hapus folder node_modules
-hapus package.lock.json
-jalankan npm i

Ini berhasil untuk saya ...

Menghapus dan menginstal ulang gatsby (v 2.23.11) berhasil untuk saya.

gunakan pemasangan benang, yang seharusnya berfungsi

Jadi yang saya lakukan (setelah membaca semuanya sejauh ini) adalah saya mengubah versi di file package.json dari Gatsby 2.18.7 dan menjalankan npm i Berhasil

Masih mengalami masalah ini.

$: gatsby -v
Gatsby CLI version: 2.12.66
Gatsby version: 2.23.12

Langkah-langkah untuk mereproduksi:

  1. gunakan gatsby new untuk membuat proyek baru
  2. instal sass menggunakan npm i --save node-sass gatsby-plugin-sass
  3. jalankan gatsby develop

Hasil

$ gatsby develop

 ERROR

The above error occurred in the <StoreStateProvider> component:
    in StoreStateProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.


 ERROR

Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.


 ERROR

UNHANDLED REJECTION Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.



  Error: Invalid hook call. Hooks can only be called inside of the body of a fun  ction component. This could happen for one of the following reasons:
  1. You might have mismatching versions of React and the renderer (such as Reac  t DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
  See https://fb.me/react-invalid-hook-call for tips about how to debug and fix   this problem.

  - react.development.js:1465 resolveDispatcher
    [bug]/[gatsby]/[react]/cjs/react.development.js:1465:13

  - react.development.js:1496 useState
    [bug]/[gatsby]/[react]/cjs/react.development.js:1496:20

  - context.js:21 StoreStateProvider
    [bug]/[gatsby]/[gatsby-cli]/lib/reporter/loggers/ink/context.js:21:49

  - react-reconciler.development.js:6036 renderWithHooks
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:6036:18

  - react-reconciler.development.js:8570 mountIndeterminateComponent
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:8570:13

  - react-reconciler.development.js:9938 beginWork$1
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:9938:16

  - react-reconciler.development.js:11563 Object.invokeGuardedCallbackImpl
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:11563:10

  - react-reconciler.development.js:11740 invokeGuardedCallback
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:11740:31

  - react-reconciler.development.js:15778 beginWork$$1
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:15778:7

  - react-reconciler.development.js:14696 performUnitOfWork
    [bug]/[ink]/[react-reconciler]/cjs/react-reconciler.development.js:14696:12

Ini diperbaiki dengan menerapkan instruksi dengan melakukan hal berikut seperti yang dijelaskan di atas ☝️

Jadi yang saya lakukan (setelah membaca semuanya sejauh ini) adalah saya mengubah versi di file package.json dari Gatsby 2.18.7 dan menjalankan
npm i Berhasil

Menghapus folder .cache dan node_modules, serta package-lock.json dan menginstal ulang berhasil untuk saya.

Saya memberikan upgrade benang dan itu berhasil untuk saya.

Menghapus file node_modules , npm cache, dan file package-lock.json adalah solusi yang tidak praktis untuk perubahan yang dapat mengganggu setiap kali plugin atau dependensi ditambahkan.

Masalah mendasar dalam kasus saya adalah bahwa proyek baru yang disediakan menggunakan gatsby new [path] [starter] secara implisit menggunakan yarn untuk mem-bootstrap ketergantungan jika yarn diinstal dan tersedia ( which yarn mengembalikan string yang tidak kosong). Upaya selanjutnya untuk menginstal plugin / dependensi menggunakan npm akan gagal dengan kesalahan samar seperti yang diposting di atas karena npm dan yarn adalah solusi manajemen paket yang saling eksklusif.

Akan lebih baik jika gatsby cli tidak default ke yarn tanpa opsi baris perintah yang memintanya. Resolusi bagi saya adalah mencopot pemasangan benang dan menginisialisasi ulang proyek sehingga npm dapat digunakan secara eksklusif.

https://github.com/gatsbyjs/gatsby/pull/26887 (digabungkan kemarin dan dirilis hari ini) yang menghapus react dari ketergantungan gatsby-cli dan sebagai gantinya membundelnya ketika kami menerbitkan paket - apa ini maksudnya adalah bahwa itu seharusnya tidak menghasilkan banyak salinan aneh dari react di node_modules yang menyebabkan semua jenis masalah.

@ duchess-toffee Anda mungkin menganggap https://github.com/gatsbyjs/gatsby/pull/26856 menarik (belum digabungkan / dirilis) - sementara itu tidak akan otomatis kembali dari yarn menjadi npm sebagai manajer paket default - Anda akan dapat menjalankan gatsby options set pm npm

Saya mengalami masalah yang tampaknya terkait dengan masalah # 26998 ini

Diselesaikan menggunakan konfigurasi webpack khusus untuk menyelesaikan react :

`` `` js
// file: gatsby-node.js
jalur const = membutuhkan ('jalur')

module.exports = {
onCreateWebpackConfig: ({actions}) => {
actions.setWebpackConfig ({
menyelesaikan: {
alias: {
'react': path.resolve (path.join (__ dirname, 'node_modules', 'react'))
}
}
})
}
}
`` ''

json // file: package.json { "dependencies": { "@mdx-js/mdx": "^1.6.18", "@mdx-js/react": "^1.6.18", "gatsby": "^2.24.64", "gatsby-plugin-layout": "^1.3.11", "gatsby-plugin-mdx": "^1.2.40", "gatsby-plugin-sass": "^2.3.12", "gatsby-source-filesystem": "^2.3.30", "gatsby-telemetry": "^1.3.35", "node-sass": "^4.14.1", "react": "^16.13.1", "react-dom": "^16.13.1", "react-ionicons-v5": "^1.2.0", "three": "^0.120.1" } }

Semuanya berjalan lancar sekarang.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat

Masalah terkait

benstr picture benstr  Β·  3Komentar

brandonmp picture brandonmp  Β·  3Komentar

andykais picture andykais  Β·  3Komentar

kalinchernev picture kalinchernev  Β·  3Komentar

jimfilippou picture jimfilippou  Β·  3Komentar