[Gatsby site builds locally but fails on Netlify], Error Message: Command failed with exit code 1: gatsby build

[sjsajju]

Hello I am very knew to using netlify and in fact to the whole web development. I learnt about Gatsby and netlify and thought to myself to see what can be done. I have this website that is running locally without any error. I have infact built it locally and didn’t have any errors. Now when I wanted to deploy it, I keep getting this strange error about Netlify not being able to resolve a file and then it fails the build. Noe I have attached necessary screenshot and build log along with my repository link. I just don’t understand what is the problem and have been frustrated by it. Would their be anyone who could help me please. I will be utterly grateful!

Github Repository: https://github.com/sjsajju/stairways
Netlify Site Name: https://blissful-bhaskara-e2460a.netlify.app/

Build Log:

######################################################################
6:30:02 PM: Waiting for other deploys from your team to complete
6:31:34 PM: Build ready to start
6:31:35 PM: build-image version: 253f72909528f25a82c4640ca58f2e974d52abd9
6:31:35 PM: build-image tag: v3.4.4
6:31:35 PM: buildbot version: d7fbddb77714d524c4b4de0312067b122124afee
6:31:35 PM: Building without cache
6:31:35 PM: Starting to prepare the repo for build
6:31:36 PM: No cached dependencies found. Cloning fresh repo
6:31:36 PM: git clone https://github.com/sjsajju/stairways
6:31:50 PM: Preparing Git Reference refs/heads/master
6:31:52 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'public' versus 'public/' in the Netlify UI
6:31:53 PM: Starting build script
6:31:53 PM: Installing dependencies
6:31:53 PM: Python version set to 2.7
6:31:54 PM: v12.18.0 is already installed.
6:31:54 PM: Now using node v12.18.0 (npm v6.14.4)
6:31:54 PM: Started restoring cached build plugins
6:31:54 PM: Finished restoring cached build plugins
6:31:55 PM: Attempting ruby version 2.7.1, read from environment
6:31:56 PM: Using ruby version 2.7.1
6:31:56 PM: Using PHP version 5.6
6:31:56 PM: 5.2 is already installed.
6:31:56 PM: Using Swift version 5.2
6:31:56 PM: Started restoring cached node modules
6:31:57 PM: Finished restoring cached node modules
6:31:58 PM: Installing NPM modules using NPM version 6.14.4
6:32:50 PM: > sharp@0.25.4 install /opt/build/repo/node_modules/sharp
6:32:50 PM: > (node install/libvips && node install/dll-copy && prebuild-install --runtime=napi) || (node-gyp rebuild && node install/dll-copy)
6:32:51 PM: info sharp Downloading https://github.com/lovell/sharp-libvips/releases/download/v8.9.1/libvips-8.9.1-linux-x64.tar.gz
6:32:54 PM: > core-js@2.6.11 postinstall /opt/build/repo/node_modules/babel-runtime/node_modules/core-js
6:32:54 PM: > node -e "try{require('./postinstall')}catch(e){}"
6:32:54 PM: > core-js@3.6.5 postinstall /opt/build/repo/node_modules/core-js
6:32:54 PM: > node -e "try{require('./postinstall')}catch(e){}"
6:32:54 PM: > core-js-pure@3.6.5 postinstall /opt/build/repo/node_modules/core-js-pure
6:32:54 PM: > node -e "try{require('./postinstall')}catch(e){}"
6:32:55 PM: > gatsby-telemetry@1.3.35 postinstall /opt/build/repo/node_modules/gatsby-telemetry
6:32:55 PM: > node src/postinstall.js || true
6:32:55 PM: > mozjpeg@7.0.0 postinstall /opt/build/repo/node_modules/mozjpeg
6:32:55 PM: > node lib/install.js
6:32:56 PM:   ✔ mozjpeg pre-build test passed successfully
6:32:56 PM: > pngquant-bin@6.0.0 postinstall /opt/build/repo/node_modules/pngquant-bin
6:32:56 PM: > node lib/install.js
6:32:56 PM:   ✔ pngquant pre-build test passed successfully
6:32:56 PM: > gatsby-cli@2.12.98 postinstall /opt/build/repo/node_modules/gatsby/node_modules/gatsby-cli
6:32:56 PM: > node scripts/postinstall.js
6:32:56 PM: > gatsby@2.24.61 postinstall /opt/build/repo/node_modules/gatsby
6:32:56 PM: > node scripts/postinstall.js
6:33:00 PM: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules/fsevents):
6:33:00 PM: npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
6:33:00 PM: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.1.3 (node_modules/chokidar/node_modules/fsevents):
6:33:00 PM: npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
6:33:00 PM: added 2393 packages from 1334 contributors and audited 2400 packages in 61.309s
6:33:02 PM: 174 packages are looking for funding
6:33:02 PM:   run `npm fund` for details
6:33:02 PM: found 4 vulnerabilities (1 low, 3 high)
6:33:02 PM:   run `npm audit fix` to fix them, or `npm audit` for details
6:33:03 PM: NPM modules installed
6:33:03 PM: Started restoring cached go cache
6:33:03 PM: Finished restoring cached go cache
6:33:03 PM: go version go1.14.4 linux/amd64
6:33:03 PM: go version go1.14.4 linux/amd64
6:33:03 PM: Installing missing commands
6:33:03 PM: Verify run directory
6:33:04 PM: ​
6:33:04 PM: ┌─────────────────────────────┐
6:33:04 PM: │        Netlify Build        │
6:33:04 PM: └─────────────────────────────┘
6:33:04 PM: ​
6:33:04 PM: ❯ Version
6:33:04 PM:   @netlify/build 5.2.1
6:33:04 PM: ​
6:33:04 PM: ❯ Flags
6:33:04 PM:   deployId: 5fa7f2daab38894d6f2e9201
6:33:04 PM:   mode: buildbot
6:33:04 PM: ​
6:33:04 PM: ❯ Current directory
6:33:04 PM:   /opt/build/repo
6:33:04 PM: ​
6:33:04 PM: ❯ Config file
6:33:04 PM:   No config file was defined: using default values.
6:33:04 PM: ​
6:33:04 PM: ❯ Context
6:33:04 PM:   production
6:33:04 PM: ​
6:33:04 PM: ┌───────────────────────────────────┐
6:33:04 PM: │ 1. Build command from Netlify app │
6:33:04 PM: └───────────────────────────────────┘
6:33:04 PM: ​
6:33:04 PM: $ gatsby build
6:33:07 PM: success open and validate gatsby-configs - 0.018s
6:33:07 PM: success load plugins - 0.568s
6:33:07 PM: success onPreInit - 0.027s
6:33:07 PM: success delete html and css files from previous builds - 0.006s
6:33:07 PM: success initialize cache - 0.005s
6:33:07 PM: success copy gatsby files - 0.043s
6:33:07 PM: success onPreBootstrap - 0.018s
6:33:08 PM: success createSchemaCustomization - 0.004s
6:33:08 PM: success Checking for changed pages - 0.000s
6:33:08 PM: success source and transform nodes - 0.141s
6:33:08 PM: success building schema - 0.400s
6:33:08 PM: info Total nodes: 45, SitePage nodes: 1 (use --verbose for breakdown)
6:33:08 PM: success createPages - 0.001s
6:33:08 PM: success Checking for changed pages - 0.000s
6:33:08 PM: success createPagesStatefully - 0.077s
6:33:08 PM: success update schema - 0.025s
6:33:08 PM: success onPreExtractQueries - 0.001s
6:33:09 PM: success extract queries from components - 0.412s
6:33:09 PM: success write out redirect data - 0.001s
6:33:09 PM: success Build manifest and related icons - 0.143s
6:33:09 PM: success onPostBootstrap - 0.145s
6:33:09 PM: info bootstrap finished - 4.673s
6:33:09 PM: success run static queries - 0.016s - 2/2 125.28/s
6:33:09 PM: success run page queries - 0.012s - 5/5 408.44/s
6:33:09 PM: success write out requires - 0.004s
6:33:25 PM: failed Building production JavaScript and CSS bundles - 15.808s
6:33:25 PM: error Generating JavaScript bundles failed
6:33:25 PM: Can't resolve '../components/layout' in '/opt/build/repo/src/pages'
6:33:25 PM: If you're trying to use a package make sure that '../components/layout' is installed. If you're trying to use a local file make sure that the path is correct.
6:33:25 PM: error Generating JavaScript bundles failed
6:33:25 PM: Can't resolve '../components/layout' in '/opt/build/repo/src/pages'
6:33:25 PM: If you're trying to use a package make sure that '../components/layout' is installed. If you're trying to use a local file make sure that the path is correct.
6:33:25 PM: error Generating JavaScript bundles failed
6:33:25 PM: Can't resolve '../components/layout' in '/opt/build/repo/src/pages'
6:33:25 PM: If you're trying to use a package make sure that '../components/layout' is installed. If you're trying to use a local file make sure that the path is correct.
6:33:25 PM: error Generating JavaScript bundles failed
6:33:25 PM: Can't resolve '../components/layout' in '/opt/build/repo/src/pages'
6:33:25 PM: If you're trying to use a package make sure that '../components/layout' is installed. If you're trying to use a local file make sure that the path is correct.
6:33:25 PM: ​
6:33:25 PM: ┌─────────────────────────────┐
6:33:25 PM: │   "build.command" failed    │
6:33:25 PM: └─────────────────────────────┘
6:33:25 PM: ​
6:33:25 PM:   Error message
6:33:25 PM:   Command failed with exit code 1: gatsby build
6:33:25 PM: ​
6:33:25 PM:   Error location
6:33:25 PM:   In Build command from Netlify app:
6:33:25 PM:   gatsby build
6:33:25 PM: ​
6:33:25 PM:   Resolved config
6:33:25 PM:   build:
6:33:25 PM:     command: gatsby build
6:33:25 PM:     commandOrigin: ui
6:33:25 PM:     publish: /opt/build/repo/public
6:33:25 PM: Caching artifacts
6:33:25 PM: Started saving node modules
6:33:25 PM: Finished saving node modules
6:33:25 PM: Started saving build plugins
6:33:25 PM: Finished saving build plugins
6:33:25 PM: Started saving pip cache
6:33:25 PM: Finished saving pip cache
6:33:25 PM: Started saving emacs cask dependencies
6:33:25 PM: Finished saving emacs cask dependencies
6:33:25 PM: Started saving maven dependencies
6:33:25 PM: Finished saving maven dependencies
6:33:25 PM: Started saving boot dependencies
6:33:25 PM: Finished saving boot dependencies
6:33:25 PM: Started saving go dependencies
6:33:25 PM: Finished saving go dependencies
6:33:28 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
6:33:28 PM: Failing build: Failed to build site
6:33:28 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2
6:33:28 PM: Finished processing build request in 1m52.652576089s
#######################################################################

Build Settings Screenshot:

[hrishikesh]

I haven’t yet checked your repo locally on my device, but, the possible source of error might be incorrect case in filenames.

You’ve named the file /components/Layout.js and are importing it as ../components/layout. Maybe try keeping the case same, that is, either rename Layout.js to layout.js or change the import statement to ../components/Layout. I had recently troubleshooted a case which had this issue.

Also, a fatal problem is that you’re alo uploading .cache, node_modules and public to your Github repository. Kindly add it to .gitignore as it increases the repo clone time.

[sjsajju]

Thank you @hrishikesh for your reply. I really appreciate that you took a look at the post. The case sensitivity issue that you are refereeing doesn’t seem to be my issue although at first I thought so too. I have named my file as layout.js and not Layout.js and I import it as import Layout from "../components/layout" at the very start of each file where I need it. So I don’t know why I might be having this issue then.

Other thing is that I have included node_modules, .cache in my .gitignore file but don’t understand why it is still uploaded. Forgive me for it as I am really new to this stuff and might very possibly be making a mistake and would really appreciate your guidance.
But would it be possible for you to visit the repo and if not possible to clone it and might help me about the problem? I am sorry if I am asking for too much

[hrishikesh]

@sjsajju

I have named my file as layout.js and not Layout.js

GitHub renamed it to Layout.js then. Even the last time the one who opened the thread said that GitHub changed the case in file name. I’ll see if I can find the thread till then. (EDIT: here it is: "build.command" failed. Error refers to Webpack)

@sjsajju

I have included node_modules , .cache in my .gitignore

Yeah I saw that when I downloaded the repo, forgot to edit my post. I tried your repo locally and it build find for me too. I’m on Windows by the way.

[sjsajju]

oooh shoot! So Github did actually renamed it to Layout.js. I never imagined something like this could ever happen. So @hrishikesh is my best course of action is to rename this file to uppercase Layout.js form layout.js and push it?

[hrishikesh]

@sjsajju

is my best course of action is to rename this file to uppercase

I just checked your website by creating another Netlify website. The build was failing with the same error as you mentioned. I went ahead and changed all ../components/layout to ../components/Layout (found 4 in /src/pages/) and it works! So, it indeed was the issue.

[sjsajju]

wow so many many many thanks @hrishikesh! I did the same and it is now deployed. There is one specific issue though. My websites looks different locally and on production through netlify it looks very different., I’ll attach screenshots:

Netlify Production Website

Now I am probably spamming you but can you please suggest me what can I do to make it right or why is it like this? Should I make another thread where I can discuss it?

[hrishikesh]

@sjsajju

Now I am probably spamming you

It’s no problem. I enjoy solving problems.

The problem you’re facing is probably some issue with Gatsby. This is what I get in console:

I’ll check more soon.

By the way, here’s the production website that I’m getting in the version I published:

Also, there are no errors in console. Are you by any chance running gatsby deploy on Netlify, because the console errors that I saw on your website are generally not thrown in production build.

[sjsajju]

I am getting a lot of errors in the console of the production site. Here’s the screenshot:

All these errors are pretty consistent with the ones you shared. What I did was out of curiosity ran the command of gatsby build which resulted in some changes in some files probably in the public folder which I committed after posting to this forum. So when you would have cloned the repo, those changes wouldn’t have been pushed at the time and the resulted production site that you got was perfect end result with the intended look.
Now is there anyway that I can revert to the version that you cloned? Because now I really suspect that the gatsby build command has made this problem.

[hrishikesh]

@sjsajju

Now is there anyway that I can revert to the version that you cloned

Here you go: https://github.com/Hrishikesh-K/stairways-master

Luckily for you, I had forgotten to delete it after testing. This is going to be the fixed version that worked perfectly as in the screenshot above.

On a side note, always run gatsby build after a gatsby clean. It will make sure, to clean your gatsby cache and rebuild properly. Many of the errors usually occur because of the .cache folder.

About committing those changes to the repository, I really don’t understand how, even after adding the folders to .gitignore, it’s being uploaded to your repo. How exactly are you uploading? Or maybe, you uploaded the files before adding .gitignore. In that case, I’d suggest you to delete the repo and create a new one with only the files that are currently there in my repo.

[sjsajju]

@hrishikesh you sir are a true saint. Thanks for all your help and time. It really was all the problems that you pointed out. After taking care of the issues you told about, I deployed my website again from the Netlify and all things look and work correctly. I can’t thank you enough!

[hrishikesh]

I’m glad it’s all sorted out.