gatsbyjs / gatsby

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

Receiving Webpack Error on Netlify but builds fine locally #30818

Closed diresh-shrestha closed 3 years ago

diresh-shrestha commented 3 years ago

Description

Hey guys. I decided to migrate my personal website from Gatsby v2 to v3. I had a few hiccups but I managed to sort them out and my website built fine locally. I committed the changes in package.json and package-lock.json and gatsby-config.js and pushed it. I went to Netlify (where the site is hosted) and saw that the build failed. I don't know if this is a Netlify issue or a Gatsby issue.

Steps to reproduce

I just followed the official guide and updated all my packages and plugins. Here's the repo: https://github.com/diresh-shrestha/diresh.io

Expected result

Build successfully on Netlify with the site going live.

Actual result

1:07:13 PM: $ gatsby build
1:07:16 PM: success open and validate gatsby-configs - 0.111s
1:07:17 PM: warning Plugin gatsby-plugin-hubspot is not compatible with your gatsby version 3.2.1 - It requires gatsby@^2.0.0
1:07:18 PM: warning Plugin gatsby-plugin-hubspot is not compatible with your gatsby version 3.2.1 - It requires gatsby@^2.0.0
1:07:18 PM: success load plugins - 1.619s
1:07:18 PM: success onPreInit - 0.073s
1:07:18 PM: success delete html and css files from previous builds - 0.006s
1:07:18 PM: success initialize cache - 0.007s
1:07:18 PM: success copy gatsby files - 0.068s
1:07:18 PM: success onPreBootstrap - 0.018s
1:07:18 PM: success createSchemaCustomization - 0.010s
1:07:23 PM: success Checking for changed pages - 0.000s
1:07:23 PM: success source and transform nodes - 4.620s
1:07:24 PM: success building schema - 0.827s
1:07:24 PM: info Total nodes: 215, SitePage nodes: 21 (use --verbose for breakdown)
1:07:24 PM: success createPages - 0.094s
1:07:24 PM: success Checking for changed pages - 0.000s
1:07:24 PM: success createPagesStatefully - 0.121s
1:07:24 PM: success update schema - 0.088s
1:07:24 PM: success onPreExtractQueries - 0.000s
1:07:25 PM: success extract queries from components - 0.801s
1:07:25 PM: success write out redirect data - 0.001s
1:07:25 PM: warning The icon(src/images/hero.jpg) you provided to 'gatsby-plugin-manifest' is not square.
1:07:25 PM: The icons we generate will be square and for the best results we recommend you provide a square icon.
1:07:25 PM: success Build manifest and related icons - 0.192s
1:07:25 PM: success onPostBootstrap - 0.197s
1:07:25 PM: info bootstrap finished - 11.997s
1:07:25 PM: warning [gatsby-transformer-sharp] The "fixed" and "fluid" resolvers are now deprecated. Switch to "gatsby-plugin-image" for better performance and a simpler API. See https://gatsby.dev/migrate-images to learn how.
1:07:31 PM: success run static queries - 6.149s - 5/5 0.81/s
1:07:40 PM: success run page queries - 8.824s - 25/25 2.83/s
1:07:40 PM: success write out requires - 0.006s
1:09:04 PM: success Building production JavaScript and CSS bundles - 83.629s
1:09:04 PM: success Rewriting compilation hashes - 0.002s
1:09:33 PM: success Building HTML renderer - 28.894s
1:09:35 PM: failed Building static HTML for pages - 2.094s
1:09:35 PM: error Building static HTML failed
1:09:35 PM: 
1:09:35 PM:   24799 |     if (mod && mod.__esModule) return mod;
1:09:35 PM:   24800 |     var result = {};
1:09:35 PM: > 24801 |     if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
1:09:35 PM:         | ^
1:09:35 PM:   24802 |     result["default"] = mod;
1:09:35 PM:   24803 |     return result;
1:09:35 PM:   24804 |   };
1:09:35 PM: 
1:09:35 PM:   WebpackError: TypeError: 'get' on proxy: property 'constants' is a read-only a  nd non-configurable data property on the proxy target but the proxy did not re  turn its actual value (expected '[object Object]' but got '[object Object]')
1:09:35 PM:   
1:09:35 PM:   - index.js:24801 
1:09:35 PM:     [Diresh.io]/[prettier]/index.js:24801:1
1:09:35 PM:   
1:09:35 PM:   - index.js:24810 
1:09:35 PM:     [Diresh.io]/[prettier]/index.js:24810:1
1:09:35 PM:   
1:09:35 PM:   - index.js:2176 
1:09:35 PM:     [Diresh.io]/[prettier]/index.js:2176:3
1:09:35 PM:   
1:09:35 PM:   - index.js:24659 
1:09:35 PM:     [Diresh.io]/[prettier]/index.js:24659:1
1:09:35 PM:   
1:09:35 PM:   - bootstrap:19 
1:09:35 PM:     Diresh.io/webpack/bootstrap:19:1
1:09:35 PM:   
1:09:35 PM:   - bootstrap:19 
1:09:35 PM:     Diresh.io/webpack/bootstrap:19:1
1:09:35 PM:   
1:09:35 PM:   - bootstrap:19 
1:09:35 PM:     Diresh.io/webpack/bootstrap:19:1
1:09:35 PM:   
1:09:35 PM:   - bootstrap:19 
1:09:35 PM:     Diresh.io/webpack/bootstrap:19:1
1:09:35 PM:   
1:09:35 PM:   - bootstrap:19 
1:09:35 PM:     Diresh.io/webpack/bootstrap:19:1
1:09:35 PM:   
1:09:35 PM:   - bootstrap:19 
1:09:35 PM:     Diresh.io/webpack/bootstrap:19:1
1:09:35 PM:   
1:09:35 PM:   - sync-requires.js:8 
1:09:35 PM:     Diresh.io/.cache/_this_is_virtual_fs_path_/$virtual/sync-requires.js:8:49
1:09:35 PM:   
1:09:35 PM: 
1:09:35 PM: ​
1:09:35 PM: ────────────────────────────────────────────────────────────────
1:09:35 PM:   "build.command" failed                                        
1:09:35 PM: ────────────────────────────────────────────────────────────────
1:09:35 PM: ​
1:09:35 PM:   Error message
1:09:35 PM:   Command failed with exit code 1: gatsby build
1:09:35 PM: ​
1:09:35 PM:   Error location
1:09:35 PM:   In Build command from Netlify app:
1:09:35 PM:   gatsby build

Environment

 System:
    OS: Linux 5.11 Pop!_OS 20.10
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 14.15.4 - ~/.nvm/versions/node/v14.15.4/bin/node
    Yarn: 1.22.10 - ~/.nvm/versions/node/v14.15.4/bin/yarn
    npm: 6.14.10 - ~/.nvm/versions/node/v14.15.4/bin/npm
  Languages:
    Python: 2.7.18 - /usr/bin/python
  Browsers:
    Chrome: 89.0.4389.90
    Firefox: 87.0
  npmPackages:
    gatsby: ^3.2.1 => 3.2.1
    gatsby-image: ^3.2.0 => 3.2.0
    gatsby-plugin-anchor-links: ^1.2.1 => 1.2.1
    gatsby-plugin-dark-mode: ^1.1.2 => 1.1.2
    gatsby-plugin-disqus: ^1.2.2 => 1.2.2
    gatsby-plugin-google-gtag: ^3.2.0 => 3.2.0
    gatsby-plugin-hubspot: ^1.3.4 => 1.3.4
    gatsby-plugin-mailchimp: ^5.2.2 => 5.2.2
    gatsby-plugin-manifest: ^3.2.0 => 3.2.0
    gatsby-plugin-mdx: ^2.2.0 => 2.2.0
    gatsby-plugin-nprogress: ^3.2.0 => 3.2.0
    gatsby-plugin-offline: ^4.2.0 => 4.2.0
    gatsby-plugin-postcss: ^4.2.0 => 4.2.0
    gatsby-plugin-react-helmet: ^4.2.0 => 4.2.0
    gatsby-plugin-sharp: ^3.2.1 => 3.2.1
    gatsby-plugin-sitemap: ^3.2.0 => 3.2.0
    gatsby-plugin-social9-socialshare: ^1.0.4 => 1.0.4
    gatsby-plugin-styled-components: ^4.2.0 => 4.2.0
    gatsby-plugin-typography: ^3.2.0 => 3.2.0
    gatsby-remark-autolink-headers: ^3.2.0 => 3.2.0
    gatsby-remark-images: ^4.2.0 => 4.2.0
    gatsby-remark-images-medium-zoom: ^1.7.0 => 1.7.0
    gatsby-remark-lang-slug: ^0.2.0 => 0.2.0
    gatsby-remark-prismjs: ^4.2.0 => 4.2.0
    gatsby-source-filesystem: ^3.2.0 => 3.2.0
    gatsby-transformer-remark: ^3.2.0 => 3.2.0
    gatsby-transformer-sharp: ^3.2.0 => 3.2.0
  npmGlobalPackages:
    gatsby-cli: 3.2.0
LekoArts commented 3 years ago

Hi, thanks for the issue!

Are you sure this only happens on Netlify and not also during a "fresh" gatsby build? Meaning: Delete .cache and public folder and run a gatsby build. The error might suggest that you have incorrect imports in a file / some files.

Anyhow, if this isn't reproducible locally it might be best to ask Netlify support on this (especially if it works on other platforms like https://www.gatsbyjs.com/cloud/)

diresh-shrestha commented 3 years ago

Hi, it turns out it does indeed not build locally either. I should have clarified that it runs gatsby develop. I will try to find and fix the imports as you suggested.

diresh-shrestha commented 3 years ago

Fixed! Just used VS Code's "Organize Imports" command on all my files and that fixed it.