6

I'm trying to deploy my portfolio website using AWS S3, CloudFront, CodePipeline, and Travis CI. Everything works fine, but Travis CI build keeps failing.

gatsby build gives me an error with:

error #98123 WEBPACK

Generating JavaScript bundles failed

This question is very similar to mine, but the solution was irrelevant to mine because I don't have yarn file and I tried reinstalling my npm dependencies.

Here is the copy of my logs:


Generating JavaScript bundles failed

Can't resolve '../components/Layout' in '/home/travis/build/stomg7969/react-portfolio/src/pages'

File: src/pages/index.js

See our docs page for more info on this error: https://gatsby.dev/issue-how-to

error #98123 WEBPACK 

Generating JavaScript bundles failed

Can't resolve '../components/Layout' in '/home/travis/build/stomg7969/react-portfolio/src/pages'

File: src/pages/404.js

See our docs page for more info on this error: https://gatsby.dev/issue-how-to

The command "gatsby clean && gatsby build" exited with 1.

store build cache

Done. Your build exited with 1.

And here is my package.json.

  "name": "gatsby-starter-spectral",
  "version": "0.0.1",
  "description": "Gatsby.js V2 starter template based on Spectral by HTML5 UP",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/anubhavsrivastava/gatsby-starter-spectral.git"
  },
  "author": {
    "name": "Anubhav Srivastava",
    "email": "anubhav.srivastava00@gmail.com"
  },
  "dependencies": {
    "gatsby": "^2.13.39",
    "gatsby-plugin-manifest": "^2.2.3",
    "gatsby-plugin-offline": "^2.1.0",
    "gatsby-plugin-react-helmet": "^3.0.12",
    "gatsby-plugin-sass": "^2.0.11",
    "node-sass": "^4.12.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-helmet": "^5.2.1",
    "react-images": "1.0.0",
    "react-scrollspy": "^3.4.0",
    "smoothscroll-polyfill": "^0.4.4"
  },
  "scripts": {
    "develop": "gatsby develop",
    "build": "npm run clean && gatsby build",
    "deploy": "npm run clean && gatsby build --prefix-paths && gh-pages -d public",
    "serve": "gatsby serve",
    "clean": "rimraf .cache public",
    "format": "prettier --write '**/*.js'",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "devDependencies": {
    "gh-pages": "^2.0.1",
    "prettier": "^1.17.0",
    "rimraf": "^2.6.3"
  },
  "keywords": [
    "gatsby",
    "gatsby-starter",
    "gatsby-starter-spectral"
  ],
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/anubhavsrivastava/gatsby-starter-spectral/issues"
  },
  "homepage": "https://github.com/anubhavsrivastava/gatsby-starter-spectral#readme"
}

Lastly, this is my .travis.yml file.

language: node_js
node_js:
- 11.8.0
install: npm install
script: gatsby clean && gatsby build
deploy:
  provider: s3
  access_key_id: $AWS_KEY
  secret_access_key: $AWS_SECRET
  bucket: 'thedevelopark.com'
  skip_cleanup: true
  acl: public_read
  local_dir: public

Thank you in advance for your feedback.

k1nate
  • 83
  • 7
  • locally everything is working? logs suggest that it couldn't find a file which is 'layout' used by both pages 404 and index.js – theAnubhav Jul 26 '19 at 16:15
  • Thank you for the response. Yes, locally, 'gatsby build' or 'npm run build' works just fine, no problem at all. It only gives me the error when I try to run it on Travis CI or AWS CodeBuild (same error that I tried about a week ago). *** The 'layout' is the component for the footer on every page. [Here](https://github.com/stomg7969/react-portfolio/blob/master/src/components/layout.js) is my link to repo. – k1nate Jul 26 '19 at 17:56
  • What about adding `before_script:` to your `.travis.yml` file with `- "npm i -g gatsby-cli"` – Will Ward Jul 27 '19 at 13:43
  • Hello, sadly yes, I tried `before_script` on `.travis.yml`. – k1nate Jul 28 '19 at 17:04
  • 4
    I came across a similar issue that stumped me for far longer than I would like to admit. My issue ended up being related to case sensitivity. My mac's filesystem is case-insensitive while Travis CI build runs on a Linux instance which is case-sensitive. I had committed a filename as UPPERCASE and then later changed it on my local (case-insensitive) filesystem to lowercase, but the Travis CI Instance would always checkout the UPPERCASE version. Once I fixed that in git my build began working as expected. – xpros Aug 15 '19 at 18:35
  • @xpros Thankfully I found your comment, case-sensitivity was the exact issue I was having. – AkashBhave Aug 25 '19 at 23:10
  • same here. I had a path case-sensitivity issue. locally, it was fine. deploying it failed – Ervin E Aug 26 '19 at 04:18
  • I have been into the same issue that turns me crazy and your solution was the fix, thanks @xpros – medhatdawoud Oct 29 '19 at 21:40

1 Answers1

1

I've had the same problem and tried and checked case-sensitivity a thousand times. Wouldn't do anything.

Then I changed the name of the component in all areas, filename, import, export, you name it. Now it works.

I don't know if Netlify had a problem with my component's name "Socials"? Guess I'll never find out.

Jammar
  • 320
  • 1
  • 13