Home
Support Forums

WordPress Build Failed on Netlify but builds locally

I need advice to debug deploy https://app.netlify.com/sites/zen-carson-d9e801/deploys/5f95e139f6aab7b00d0c6e79

Its building locally but I am unable to build on Netlify please advise.

Your request is taking longer than 30s and there is a catch (in your plugin?) that throws an error, you could try increasing this as suggested in the error :slight_smile:

Thanks, @AaronP can you guide how should I increase the time?

I’ve been dabbling around but not sure if it works since I do not know your environment variables.
Could you try this in the gatsby config file?

    {
  resolve: "gatsby-source-wordpress-experimental",
  options: {
    schema: {
      timeout: 9999999,
    },
    debug: {
      graphql: {
        copyHtmlResponseOnError: true,
      },
    },
  },
},

Note that is also says:
image

I updated the above code, I think it started building but then I got the below build error:

12:48:32 AM: failed Building production JavaScript and CSS bundles - 44.382s
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: Module build failed (from …/node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js):
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: error Generating JavaScript bundles failed
12:48:32 AM: border: 1px solid $gray-300;
12:48:32 AM: ^
12:48:32 AM: Undefined variable: β€œ$gray-300”.
12:48:32 AM: in /opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss (line 7, column 21)
12:48:32 AM: not finished Generating image thumbnails - 44.709s
12:48:33 AM: error Command failed with exit code 1.
12:48:33 AM: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
12:48:33 AM: error Command failed.

So it definitely loves complaining about β€œUndefined variable: β€œ$gray-300”.” haha!

Im not an expert but in your colors.sccs file you define gray but not gray-300? Maybe just try using gray for now to see it build, I know theres post css things that you can do -light and -darker or the -300 -700 stuff but maybe thats not working here if youve attempted to set that up? :slight_smile:

I searched for β€œ$gray-300” code in my source files but I didn’t find it. It’s referring to inside node modules and plugins. Such as /node_modules/gatsby-plugin-sass/node_modules/sass-loader/dist/cjs.js and
/opt/build/repo/node_modules/@wordpress/block-library/src/calendar/style.scss

but when I access these files there is no such line of code there. :confused:

EDIT: After cloning your repo I had to go into packages/gatsby-woocommerce-theme, in there I can see a package json, that references bootstrap, and it looks like the project is using the bootstrap scss variables suchas gray-300.
This lead me to believe that either bootstrap isn’t being installed on build or the files aren’t being accessed.

I’ve not worked with a Wordpress theme before but it does look quite nested? Theres a package json in 3 of the top level folders?

Do you mine stating your build command, publish directory, and base directory set in the netlify UI for this site? Thanks!

Editing as I go: While working locally, I have realised I need to go into each folder to npm install each package json, this is probably an issue that the buildbots are running into too. (I am off to bed, will try to check in tomorrow, try to look into this area / ensure the Wordpress plugins were added correctly etc. Maybe someone with Wordpress experience would help in the meantime)

Thanks, @AaronP for checking my repo. Below are my build settings:

hey amresha, any progress on this so far? Not sure if you are still looking into this @AaronP?

1 Like

Hey, been a bit busy. I managed to build this locally by npm installing all 3 package jsons before building. Won’t have my laptop to test until Monday for a netlify build though!

Hi, @amresha. It appears you resolved the issue with the site build not working at Netlify.

If there are other questions or if you feel like to sharing the solution you found here, please reply again anytime.

1 Like