search

gatsbyjs / gatsby

The best React-based framework with performance, scalability and security built in.
https://www.gatsbyjs.com
MIT License
55.26k stars 10.31k forks source link

ReferenceError: fetch is not defined during build #19507

Closed psteinroe closed 4 years ago

psteinroe commented 4 years ago

Hi everyone,

I suddenly get the following error when building, but the build does not fail and nothing seems to be wrong with the output:

success open and validate gatsby-configs - 0.075 s
success load plugins - 1.302 s
success onPreInit - 0.022 s
success delete html and css files from previous builds - 0.027 s
success initialize cache - 0.029 s
success copy gatsby files - 0.066 s
success onPreBootstrap - 13.267 s

gatsby-source-shopify/zehnvonzehn starting to fetch data from Shopify

gatsby-source-shopify/zehnvonzehn fetched and processed ShopPolicy nodes: 486.863ms

gatsby-source-shopify/zehnvonzehn fetched and processed Collection nodes: 513.528ms
(node:20190) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated
success Downloading remote files — 2/2 - 2.066 s

gatsby-source-shopify/zehnvonzehn fetched and processed Product nodes: 2592.529ms

gatsby-source-shopify/zehnvonzehn finished fetching data from Shopify: 2592.776ms
success source and transform nodes - 2.862 s
success building schema - 0.361 s
success createPages - 0.033 s
success createPagesStatefully - 0.055 s
success onPreExtractQueries - 0.023 s
success update schema - 0.049 s
success extract queries from components - 0.361 s
success write out requires - 0.035 s
success write out redirect data - 0.026 s
success Build manifest and related icons - 0.139 s
success onPostBootstrap - 0.172 s
⠀
info bootstrap finished - 22.483 s
⠀
success run static queries - 0.040 s — 1/1 81.46 queries/second
success Building production JavaScript and CSS bundles - 26.800 s
success Rewriting compilation hashes - 0.039 s
success run page queries - 2.539 s — 8/8 3.20 queries/second
success Generating image thumbnails — 82/82 - 49.375 s
⠙ Building static HTML for pages
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:20233) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 3)
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 4)
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 5)
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 6)
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
(node:20233) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 7)
(node:20233) UnhandledPromiseRejectionWarning: ReferenceError: fetch is not defined
    at Client.fetcher (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:64805:5)
    at Client.send (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:65007:19)
    at CheckoutResource.create (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:71000:33)
    at createNewCheckout (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88352:363)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88353:187
    at Object.dispatch (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:60336:18)
    at Module../wrap-with-provider.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:88420:92)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:107
    at Array.map (<anonymous>)
    at ./.cache/api-runner-ssr.js.module.exports (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:120:21)
    at Module../.cache/static-entry.js.__webpack_exports__.default (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/public/render-page.js:576:510)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:35:36
    at Promise._execute (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/debuggability.js:313:9)
    at Promise._resolveFromExecutor (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:488:18)
    at new Promise (/Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/bluebird/js/release/promise.js:79:10)
    at /Users/philippsteinroetter/Developer/zehnvonzehn-shop/node_modules/gatsby/dist/utils/worker/render-html.js:31:37
success Building static HTML for pages - 4.419 s — 8/8 16.07 pages/second
Generated public/sw.js, which will precache 23 files, totaling 829822 bytes.
info Done building in 103.389454879 sec

Steps to reproduce

I can not really say how to reproduce as this error now occurs after only a minor change in the code (I deleted a page).

Environment


  System:
    OS: macOS 10.15
    CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.11.1 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.13.0 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /Users/philippsteinroetter/.pyenv/shims/python
  Browsers:
    Chrome: 78.0.3904.97
    Safari: 13.0.2
  npmGlobalPackages:
    gatsby-cli: 2.8.10
wardpeet commented 4 years ago

Hey,

fetch isn't available during SSR. It looks like your react components are using fetch somewhere.

You might want to look into https://www.gatsbyjs.org/docs/using-client-side-only-packages/.

Sorry to hear you're running into an issue. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.

If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look.

Thanks for using Gatsby! 💜

psteinroe commented 4 years ago

Thanks for the fast response!!

I guess its the Shopify Buy Button which is using fetch. I have had a similar error with the firebase SDK and I solved it by excluding its injection during the build phase. Would a similar approach be possible for the Shopify buy button sdk? Are there any pros / cons compared to the suggestions in the docs?

// gatsby-ssr.js
exports.onCreateWebpackConfig = ({
                                   stage,
                                   actions,
                                   getConfig,
                                 }) => {
  if (stage === "build-html") {
    actions.setWebpackConfig({
      externals: getConfig().externals.concat(function(context, request, callback) {
        const regex = /^@?firebase(\/(.+))?/
        // exclude firebase products from being bundled, so they will be loaded using require() at runtime.
        if (regex.test(request)) {
          return callback(null, "umd " + request)
        }
        callback()
      }),
    })
  }
}
wardpeet commented 4 years ago

https://www.gatsbyjs.org/docs/using-client-side-only-packages/#workaround-3-load-client-side-dependent-components-with-react-loadable

it has an example with the shopify buy button. I would suggest going for React-loadable or componentDidMount.

psteinroe commented 4 years ago

Thanks guys - can be closed!