search

saleor / storefront

Saleor Storefront built with React 18, Next.js 14, App Router, TypeScript, GraphQL, and Tailwind CSS.
https://storefront.saleor.io
BSD 3-Clause "New" or "Revised" License
1.01k stars 579 forks source link

local build issue #1004

Closed matteius closed 10 months ago

matteius commented 10 months ago

Summary

The other day this was building fine as-is, I synced the branch with canary because I am excited to test the new stripe integration, except I cannot get it to build.

matteius@matteius-VirtualBox:~/react-storefront-new$ pnpm  run build

> saleor-storefront@0.1.0 prebuild /home/matteius/react-storefront-new
> pnpm run generate

> saleor-storefront@0.1.0 generate /home/matteius/react-storefront-new
> graphql-codegen --config .graphqlrc.ts

✔ Parse Configuration
✔ Generate outputs

> saleor-storefront@0.1.0 build /home/matteius/react-storefront-new
> next build

   ▲ Next.js 14.0.0
   - Environments: .env

 ✓ Creating an optimized production build    
 ✓ Compiled successfully

./src/app/(main)/products/[slug]/page.tsx
7:8  Warning: Using exported name 'invariant' as identifier for default export.  import/no-named-as-default

./src/checkout/graphql/index.ts
2:8  Warning: Using exported name 'gql' as identifier for default export.  import/no-named-as-default

./src/checkout/hooks/useDebouncedSubmit.ts
7:26  Warning: React Hook useCallback received a function whose dependencies are unknown. Pass an inline function instead.  react-hooks/exhaustive-deps

./src/checkout/sections/PaymentSection/AdyenDropIn/AdyenDropIn.tsx
43:5  Warning: React Hook useEffect has missing dependencies: 'config.data' and 'createAdyenCheckoutInstance'. Either include them or remove the dependency array.  react-hooks/exhaustive-deps

./src/checkout/sections/PaymentSection/usePaymentGatewaysInitialize.ts
57:5  Warning: React Hook useEffect has a missing dependency: 'onSubmit'. Either include it or remove the dependency array.  react-hooks/exhaustive-deps

./src/checkout/sections/Summary/SummaryItem.tsx
23:7  Warning: Using `<img>` could result in slower LCP and higher bandwidth. Consider using `<Image />` from `next/image` to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element  @next/next/no-img-element

info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
 ✓ Linting and checking validity of types    
 ✓ Collecting page data    
   Generating static pages (8/37)  [=   ] 
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (12/37) [==  ] 
Error: No products found
    at Page (/home/matteius/react-storefront-new/.next/server/app/(main)/page.js:1:3337)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Error: No products found
    at Page (/home/matteius/react-storefront-new/.next/server/app/(main)/page.js:1:3337)
   Generating static pages (12/37) [=== ] 

Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
Error: No products found
    at Page (/home/matteius/react-storefront-new/.next/server/app/(main)/page.js:1:3337)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (16/37) [ ===] 
AuthProvider
   Generating static pages (17/37) [  ==] 
AuthProvider
   Generating static pages (17/37) [   =] 
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (19/37) [    ] 
AuthProvider
   Generating static pages (21/37) [   =] 
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (23/37) [  ==] 
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (27/37) [====] 
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (30/37) [==  ] 
AuthProvider
makeUrqlClient
AuthProvider
makeUrqlClient
AuthProvider
   Generating static pages (32/37) [=   ] 
AuthProvider
makeUrqlClient
AuthProvider
 ✓ Generating static pages (37/37) 

> Export encountered errors on following paths:
    /(main)/page: /
 ELIFECYCLE  Command failed with exit code 1.

I am running a saleor backend of 3.16.7

image

Yet there are products in the database, they loaded on an earlier version of storefront from October.

Steps to reproduce

You can build off https://api.slither.bio/graphql/ locally and see the same thing

A link to a reproduction repository

https://github.com/matteius/react-storefront

Output from envinfo

matteius@matteius-VirtualBox:~/react-storefront-new$ npx envinfo --system --binaries --browsers --markdown Need to install the following packages: envinfo@7.10.0 Ok to proceed? (y) y

System:

typeofweb commented 10 months ago

This could be due to an older version of Saleor. I've pushed a minor update that will log HTTP errors for failed GraphQL queries in the terminal. It should help you see what the underlying problem is.

matteius commented 10 months ago

I ran again with debug and the latest branch but same issue, I checkout back to what I ran before and same issue (Which is odd) --debug output says no products found but then logs a bunch of errors about my products:

Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
Error: No products found
    at Page (/home/matteius/react-storefront-new/.next/server/app/(main)/page.js:1:3337)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /login, reason: cookies
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.cookies (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:1522)
    at CartNavItem (/home/matteius/react-storefront-new/.next/server/chunks/4734.js:1:5763)
    at em (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:10452)
    at /home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:22148
    at Object.toJSON (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:25726)
    at stringify (<anonymous>)
    at eE (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:14115)
    at eR (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:14558)
    at Timeout._onTimeout (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node   Generating static pages (16/37) [ ===] 
Static generation failed due to dynamic usage on /products, reason: cookies
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.cookies (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:1522)
    at CartNavItem (/home/matteius/react-storefront-new/.next/server/chunks/4734.js:1:5763)
    at em (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:10452)
    at /home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:22148
    at Object.toJSON (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:25726)
    at stringify (<anonymous>)
    at eE (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:14115)
    at eR (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:76:14558)
    at Timeout._onTimeout (/home/matteius/react-storefront-new/node_modules/.pnpm/next@14.0.0_@babel+core@7.23.2_react-dom@18.2.0_react@18.2.0/node   Generating static pages (17/37) [  ==] 
Static generation failed due to dynamic usage on /products/1912-1919-canada-silver-50-cents-worn-date, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (18/37) [    ] 
Static generation failed due to dynamic usage on /products/1954-silver-canada-50-cents-au, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /products/1896-france-gold-20-francs-angel-ms-61, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (20/37) [   =] 
Static generation failed due to dynamic usage on /products/1965-canada-silver-dollar, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /products/1982-canada-silver-dollar-proof-bison-skull, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (22/37) [  ==] 
Static generation failed due to dynamic usage on /products/1983-canada-silver-dollar-proof-edmonton-university-games, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /products/1-gram-palladium-bar, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (24/37) [====] 
Static generation failed due to dynamic usage on /products/2019-anguilla-1-oz-silver-lobster-bu, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (25/37) [=== ] 
Static generation failed due to dynamic usage on /products/2021-niue-1-oz-silver-2-perseverance-mars-rover, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (26/37) [    ] 
Static generation failed due to dynamic usage on /products/2022-1-oz-lunar-year-of-the-tiger-series-iii-perth-mint-dragon-privy, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /products/2022-netherlands-1-oz-silver-ducaton-rider-restrike-bu, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (28/37) [=   ] 
Static generation failed due to dynamic usage on /products/2022-p-tuvalu-bart-simpson-1-oz-999-silver-bu-coin, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (29/37) [==  ] 
Static generation failed due to dynamic usage on /products/ancient-byzantine-1028-1034-romanus-iii-follis-christ, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (30/37) [  ==] 
Static generation failed due to dynamic usage on /products/1955-nepal-4-paisa-gurkhas-bullet-coin-vf, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (31/37) [   =] 
Static generation failed due to dynamic usage on /products/anonymous-byzantine-follis-christ-standing-969-1081-ad-vf-xf, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (32/37) [    ] 
Static generation failed due to dynamic usage on /products/antigua-barbuda-1-oz-silver-rum-runner-2018-bu, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /products/austria-gold-ducat-1915-bu-proof-like, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Static generation failed due to dynamic usage on /products/aztec-calendar-110-oz-silver-round, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (35/37) [   =] 
Static generation failed due to dynamic usage on /products/british-west-africa-tenth-cent-1944, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
   Generating static pages (36/37) [  ==] 
Static generation failed due to dynamic usage on /products/bronze-coins-of-the-byzantine-empire, reason: searchParams.variant
    at staticGenerationBailout (/home/matteius/react-storefront-new/.next/server/chunks/6541.js:1:4566)
    at Object.get (/home/matteius/react-storefront-new/.next/server/chunks/334.js:6:101992)
    at /home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8117
    at Array.find (<anonymous>)
    at Module.generateMetadata (/home/matteius/react-storefront-new/.next/server/app/(main)/products/[slug]/page.js:1:8096)
 ✓ Generating static pages (37/37) 

> Export encountered errors on following paths:
    /(main)/page: /
 ELIFECYCLE  Command failed with exit code 1.
matteius commented 10 months ago

I tracked it down to the file src/app/(main)/page.tsx has slug "featured-products" hardcoded, but I don't have a collection named that, so when I swapped it to something I do have, the build started working again.

I am pretty excited to see the stripe payment form now -- looks nice @mmiszy 👍

image

brandoncazander commented 9 months ago

This was super helpful in tracking down a similar issue for me, but in my case, I also had to make some products and the 'featured-products' collection active in the 'default-channel' channel 🙃.