latest changes not showing on Netlify after deployment - reactjs

This is my first time deploying a react js app to Netlify and I'm facing some issues.
every time I try to push new commits to GitHub Netlify automatically deploys it but the changes don't seem to take effect for some reason.
Here's the deployment log:
2:03:20 PM: Waiting for other deploys from your team to complete
2:03:41 PM: Build ready to start
2:03:43 PM: build-image version: ca811f47d4c1cbd1812d1eb6ecb0c977e86d1a1d
2:03:43 PM: build-image tag: v3.3.20
2:03:43 PM: buildbot version: be8ecf2af866e16fa4301cc5c14de2ccbbb21cf4
2:03:43 PM: Fetching cached dependencies
2:03:43 PM: Starting to download cache of 114.5MB
2:03:45 PM: Finished downloading cache in 1.515845861s
2:03:45 PM: Starting to extract cache
2:03:50 PM: Finished extracting cache in 5.156934064s
2:03:50 PM: Finished fetching cache in 6.69538965s
2:03:50 PM: Starting to prepare the repo for build
2:03:50 PM: Preparing Git Reference refs/heads/master
2:03:52 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'build' versus 'build/' in the Netlify UI
2:03:52 PM: Starting build script
2:03:52 PM: Installing dependencies
2:03:52 PM: Python version set to 2.7
2:03:52 PM: Started restoring cached node version
2:03:55 PM: Finished restoring cached node version
2:03:55 PM: v12.18.0 is already installed.
2:03:56 PM: Now using node v12.18.0 (npm v6.14.4)
2:03:56 PM: Started restoring cached build plugins
2:03:56 PM: Finished restoring cached build plugins
2:03:56 PM: Attempting ruby version 2.7.1, read from environment
2:03:57 PM: Using ruby version 2.7.1
2:03:57 PM: Using PHP version 5.6
2:03:57 PM: 5.2 is already installed.
2:03:57 PM: Using Swift version 5.2
2:03:57 PM: Started restoring cached node modules
2:03:57 PM: Finished restoring cached node modules
2:03:58 PM: Started restoring cached go cache
2:03:58 PM: Finished restoring cached go cache
2:03:58 PM: go version go1.14.4 linux/amd64
2:03:58 PM: go version go1.14.4 linux/amd64
2:03:58 PM: Installing missing commands
2:03:58 PM: Verify run directory
2:03:59 PM: ​
2:03:59 PM: ┌─────────────────────────────┐
2:03:59 PM: │ Netlify Build │
2:03:59 PM: └─────────────────────────────┘
2:03:59 PM: ​
2:03:59 PM: ❯ Version
2:03:59 PM: #netlify/build 3.0.1
2:03:59 PM: ​
2:03:59 PM: ❯ Flags
2:03:59 PM: deployId: 5f16bd6759d4ae00096bdb64
2:03:59 PM: mode: buildbot
2:03:59 PM: ​
2:03:59 PM: ❯ Current directory
2:03:59 PM: /opt/build/repo
2:03:59 PM: ​
2:03:59 PM: ❯ Config file
2:03:59 PM: No config file was defined: using default values.
2:03:59 PM: ​
2:03:59 PM: ❯ Context
2:03:59 PM: production
2:03:59 PM: ​
2:03:59 PM: ┌───────────────────────────────────┐
2:03:59 PM: │ 1. Build command from Netlify app │
2:03:59 PM: └───────────────────────────────────┘
2:03:59 PM: ​
2:03:59 PM: $ npm run
2:03:59 PM: Lifecycle scripts included in cortex_app:
2:03:59 PM: start
2:03:59 PM: react-scripts start
2:03:59 PM: test
2:03:59 PM: react-scripts test
2:03:59 PM: available via `npm run-script`:
2:03:59 PM: build
2:03:59 PM: react-scripts build
2:03:59 PM: eject
2:03:59 PM: react-scripts eject
2:03:59 PM: ​
2:03:59 PM: (build.command completed in 303ms)
2:03:59 PM: ​
2:03:59 PM: ┌─────────────────────────────┐
2:03:59 PM: │ Netlify Build Complete │
2:03:59 PM: └─────────────────────────────┘
2:03:59 PM: ​
2:03:59 PM: (Netlify Build completed in 322ms)
2:03:59 PM: Caching artifacts
2:03:59 PM: Started saving node modules
2:03:59 PM: Finished saving node modules
2:03:59 PM: Started saving build plugins
2:03:59 PM: Finished saving build plugins
2:03:59 PM: Started saving pip cache
2:03:59 PM: Finished saving pip cache
2:03:59 PM: Started saving emacs cask dependencies
2:03:59 PM: Finished saving emacs cask dependencies
2:03:59 PM: Started saving maven dependencies
2:03:59 PM: Finished saving maven dependencies
2:03:59 PM: Started saving boot dependencies
2:03:59 PM: Finished saving boot dependencies
2:03:59 PM: Started saving go dependencies
2:03:59 PM: Finished saving go dependencies
2:03:59 PM: Build script success
2:03:59 PM: Starting to deploy site from 'build'
2:03:59 PM: Creating deploy tree
2:03:59 PM: Creating deploy upload records
2:03:59 PM: 0 new files to upload
2:03:59 PM: 0 new functions to upload
2:03:59 PM: Starting post processing
2:03:59 PM: Post processing - HTML
2:04:00 PM: Post processing - redirect rules
2:04:00 PM: Post processing - header rules
2:04:00 PM: Post processing done
2:04:00 PM: Site is live
2:04:19 PM: Finished processing build request in 36.032433755s
the latest commit is 9421ef1 and the changes are visible on the GitHub repo. so what might be the problem in case somebody else was facing a similar issue?

It looks like your netlify build command is set to npm run, that needs to be npm run build for Netlify to know how to build your React app into a production site.
You can change that in your netlify.toml or in your Build Settings on the Netlify website.

Related

Netlify deploy React Project failed (with error message: Command failed with exit code 1: npm run build)

Below is the message I got.
I have tried other solutions such as changing the deployed setting 'CI=npm build run' and set a new environmental variable CI false But none of them worked.
below is the version without setting the 'CI=npm build run' but set CI to false.
$ npm run build
1:51:55 PM: > anqi-portfolio#0.1.0 build
1:51:55 PM: > react-scripts build
1:51:56 PM: Creating an optimized production build...
1:51:56 PM: Failed to compile.
1:51:56 PM:
1:51:56 PM: Module not found: Error: Can't resolve '../src/pages/AboutPage' in '/opt/build/repo/src'
1:51:56 PM: ​
1:51:56 PM: "build.command" failed
1:51:56 PM: ────────────────────────────────────────────────────────────────
1:51:56 PM: ​
1:51:56 PM: Error message
1:51:56 PM: Command failed with exit code 1: npm run build (https://ntl.fyi/exit-code-1)
1:51:56 PM: ​
1:51:56 PM: Error location
1:51:56 PM: In Build command from Netlify app:
1:51:56 PM: npm run build
1:51:56 PM: ​
1:51:56 PM: Resolved config
1:51:56 PM: build:
1:51:56 PM: command: npm run build
1:51:56 PM: commandOrigin: ui
1:51:56 PM: environment:
1:51:56 PM: - CI
1:51:56 PM: publish: /opt/build/repo/build
1:51:56 PM: publishOrigin: ui
1:51:57 PM: Caching artifacts
1:51:57 PM: Started saving node modules
1:51:57 PM: Finished saving node modules
1:51:57 PM: Started saving build plugins
1:51:57 PM: Finished saving build plugins
1:51:57 PM: Started saving pip cache
1:51:57 PM: Finished saving pip cache
1:51:57 PM: Started saving emacs cask dependencies
1:51:57 PM: Finished saving emacs cask dependencies
1:51:57 PM: Started saving maven dependencies
1:51:58 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2 (https://ntl.fyi/exit-code-2)
1:51:57 PM: Finished saving maven dependencies
1:51:57 PM: Started saving boot dependencies
1:51:57 PM: Finished saving boot dependencies
1:51:57 PM: Started saving rust rustup cache
1:51:57 PM: Finished saving rust rustup cache
1:51:57 PM: Started saving go dependencies
1:51:57 PM: Finished saving go dependencies
1:51:58 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
1:51:58 PM: Failing build: Failed to build site
1:51:58 PM: Finished processing build request in 30.452339066s

Issues deploying a React app on Netlify Command failed with exit code 127: build (https://ntl.fyi/exit-code-127)

I was trying to deploy a react app using Netlify but I am encountering some issues.
See below the errors in deployment phase:
12:02:58 PM: build-image version: d7b3813f01c06610bc1723ff1b22446513ee7941 (focal)
12:02:58 PM: build-image tag: v4.14.3
12:02:58 PM: buildbot version: bd7961a85189b0e0340a6a33e02f396d2d9c7afa
12:02:58 PM: Fetching cached dependencies
12:02:58 PM: Failed to fetch cache, continuing with build
12:02:58 PM: Starting to prepare the repo for build
12:02:58 PM: No cached dependencies found. Cloning fresh repo
12:02:58 PM: git clone https://github.com/SimoGhilo/Reddit_Clone
12:02:59 PM: Preparing Git Reference refs/heads/Main
12:02:59 PM: Parsing package.json dependencies
12:03:00 PM: Starting build script
12:03:00 PM: Installing dependencies
12:03:00 PM: Python version set to 2.7
12:03:01 PM: v16.18.0 is already installed.
12:03:01 PM: Now using node v16.18.0 (npm v8.19.2)
12:03:01 PM: Enabling node corepack
12:03:01 PM: Started restoring cached build plugins
12:03:01 PM: Finished restoring cached build plugins
12:03:01 PM: Attempting ruby version 2.7.2, read from environment
12:03:02 PM: Using ruby version 2.7.2
12:03:02 PM: Using PHP version 8.0
12:03:02 PM: No npm workspaces detected
12:03:02 PM: Started restoring cached node modules
12:03:02 PM: Finished restoring cached node modules
12:03:02 PM: Installing NPM modules using NPM version 8.19.2
12:03:07 PM: npm WARN deprecated stable#0.1.8: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility
12:03:09 PM: npm WARN deprecated svgo#1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
12:03:14 PM: added 1462 packages, and audited 1463 packages in 12s
12:03:14 PM: 209 packages are looking for funding
12:03:14 PM: run `npm fund` for details
12:03:14 PM: 8 high severity vulnerabilities
12:03:14 PM: To address issues that do not require attention, run:
12:03:14 PM: npm audit fix
12:03:14 PM: To address all issues (including breaking changes), run:
12:03:14 PM: npm audit fix --force
12:03:14 PM: Run `npm audit` for details.
12:03:14 PM: NPM modules installed
12:03:14 PM: Creating package sha
12:03:14 PM: Started restoring cached go cache
12:03:14 PM: Finished restoring cached go cache
12:03:14 PM: Installing Go version 1.17 (requested 1.17)
12:03:18 PM: unset GOOS;
12:03:18 PM: unset GOARCH;
12:03:18 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.17.linux.amd64';
12:03:18 PM: export PATH="/opt/buildhome/.gimme/versions/go1.17.linux.amd64/bin:${PATH}";
12:03:18 PM: go version >&2;
12:03:18 PM: export GIMME_ENV="/opt/buildhome/.gimme/env/go1.17.linux.amd64.env"
12:03:18 PM: go version go1.17 linux/amd64
12:03:19 PM: Detected the following frameworks and their versions:
12:03:19 PM: "create-react-app" at version "5.0.1"
12:03:19 PM: Installing missing commands
12:03:19 PM: Verify run directory
12:03:20 PM: ​
12:03:20 PM: ────────────────────────────────────────────────────────────────
12:03:20 PM: Netlify Build
12:03:20 PM: ────────────────────────────────────────────────────────────────
12:03:20 PM: ​
12:03:20 PM: ❯ Version
12:03:20 PM: #netlify/build 28.1.6
12:03:20 PM: ​
12:03:20 PM: ❯ Flags
12:03:20 PM: baseRelDir: true
12:03:20 PM: buildId: 63625c70591ae7067c7e852e
12:03:20 PM: deployId: 63625c70591ae7067c7e8530
12:03:20 PM: ​
12:03:20 PM: ❯ Current directory
12:03:20 PM: /opt/build/repo
12:03:20 PM: ​
12:03:20 PM: ❯ Config file
12:03:20 PM: No config file was defined: using default values.
12:03:20 PM: ​
12:03:20 PM: ❯ Context
12:03:20 PM: production
12:03:20 PM: ​
12:03:20 PM: ────────────────────────────────────────────────────────────────
12:03:20 PM: 1. Build command from Netlify app
12:03:20 PM: ────────────────────────────────────────────────────────────────
12:03:20 PM: ​
12:03:20 PM: $ build
12:03:21 PM: Creating deploy upload records
12:03:20 PM: bash: build: command not found
12:03:20 PM: ​
12:03:20 PM: ────────────────────────────────────────────────────────────────
12:03:20 PM: "build.command" failed
12:03:20 PM: ────────────────────────────────────────────────────────────────
12:03:21 PM: Failed during stage 'building site': Build script returned non-zero exit code: 2 (https://ntl.fyi/exit-code-2)
12:03:20 PM: ​
12:03:20 PM: Error message
12:03:20 PM: Command failed with exit code 127: build (https://ntl.fyi/exit-code-127)
12:03:20 PM: ​
12:03:20 PM: Error location
12:03:20 PM: In Build command from Netlify app:
12:03:20 PM: build
12:03:20 PM: ​
12:03:20 PM: Resolved config
12:03:20 PM: build:
12:03:20 PM: command: build
12:03:20 PM: commandOrigin: ui
12:03:20 PM: environment:
12:03:20 PM: - CI
12:03:20 PM: publish: /opt/build/repo
12:03:20 PM: publishOrigin: default
12:03:20 PM: Caching artifacts
12:03:20 PM: Started saving node modules
12:03:20 PM: Finished saving node modules
12:03:20 PM: Started saving build plugins
12:03:20 PM: Finished saving build plugins
12:03:20 PM: Started saving pip cache
12:03:20 PM: Finished saving pip cache
12:03:20 PM: Started saving emacs cask dependencies
12:03:21 PM: Finished saving emacs cask dependencies
12:03:21 PM: Started saving maven dependencies
12:03:21 PM: Finished saving maven dependencies
12:03:21 PM: Started saving boot dependencies
12:03:21 PM: Finished saving boot dependencies
12:03:21 PM: Started saving rust rustup cache
12:03:21 PM: Finished saving rust rustup cache
12:03:21 PM: Started saving go dependencies
12:03:21 PM: Finished saving go dependencies
12:03:21 PM: Build failed due to a user error: Build script returned non-zero exit code: 2
12:03:21 PM: Failing build: Failed to build site
12:03:21 PM: Finished processing build request in 23.43614482s
Also see my package.json:
{
"name": "reddit_project",
"version": "0.1.0",
"private": true,
"dependencies": {
"#reduxjs/toolkit": "^1.8.6",
"#testing-library/jest-dom": "^5.16.5",
"#testing-library/react": "^13.4.0",
"#testing-library/user-event": "^14.4.3",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-redux": "^8.0.4",
"react-router-dom": "^6.4.2",
"react-scripts": "5.0.1",
"redux": "^4.2.0",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "CI= npm run build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
And below are my environment variables:
Please note that the value covered is false.
I Have researched and tried different things, I changed my package.json then tweaked my setting but all seems to not produce any result.
What am i doing wrong ?
Thank you for your help.

Problem with gatsby: command not found when deploying gatsby site to netlify

I was trying to deploy gatsby site to Netlify. I commit all files from public directory within gatsby project to my github repository and then deploy that repository on netlify, but I got an error.
After pushing to github all files and directories except for public and then deploy I got following error:
12:23:37 PM: ​
12:23:37 PM: ┌─────────────────────────────┐
12:23:37 PM: │ Netlify Build │
12:23:37 PM: └─────────────────────────────┘
12:23:37 PM: ​
12:23:37 PM: ❯ Version
12:23:37 PM: #netlify/build 3.3.0
12:23:37 PM: ​
12:23:37 PM: ❯ Flags
12:23:37 PM: deployId: 5f4637d3e090c2ab4a26309c
12:23:37 PM: mode: buildbot
12:23:37 PM: ​
12:23:37 PM: ❯ Current directory
12:23:37 PM: /opt/build/repo
12:23:37 PM: ​
12:23:37 PM: ❯ Config file
12:23:37 PM: No config file was defined: using default values.
12:23:37 PM: ​
12:23:37 PM: ❯ Context
12:23:37 PM: production
12:23:37 PM: ​
12:23:37 PM: ┌───────────────────────────────────┐
12:23:37 PM: │ 1. Build command from Netlify app │
12:23:37 PM: └───────────────────────────────────┘
12:23:37 PM: ​
12:23:37 PM: $ gatsby build
12:23:40 PM: success open and validate gatsby-configs - 0.022s
12:23:40 PM: success load plugins - 0.498s
12:23:40 PM: success onPreInit - 0.040s
12:23:40 PM: success delete html and css files from previous builds - 0.002s
12:23:40 PM: success initialize cache - 0.006s
12:23:41 PM: success copy gatsby files - 0.028s
12:23:41 PM: success onPreBootstrap - 0.005s
12:23:41 PM: success createSchemaCustomization - 0.006s
12:23:41 PM: success Checking for changed pages - 0.000s
12:23:41 PM: success source and transform nodes - 0.086s
12:23:41 PM: success building schema - 0.271s
12:23:41 PM: success createPages - 0.001s
12:23:41 PM: success Checking for changed pages - 0.000s
12:23:41 PM: success createPagesStatefully - 0.067s
12:23:41 PM: success update schema - 0.023s
12:23:41 PM: success onPreExtractQueries - 0.001s
12:23:43 PM: success extract queries from components - 2.444s
12:23:43 PM: success write out redirect data - 0.001s
12:23:43 PM: success onPostBootstrap - 0.000s
12:23:43 PM: info bootstrap finished - 6.517s
12:23:44 PM: success run static queries - 0.017s - 1/1 60.34/s
12:23:44 PM: success run page queries - 0.004s - 1/1 241.80/s
12:23:44 PM: success write out requires - 0.004s
12:24:11 PM: success Building production JavaScript and CSS bundles - 27.400s
12:24:11 PM: success Rewriting compilation hashes - 0.002s
12:24:15 PM: failed Building static HTML for pages - 3.641s
12:24:15 PM: error "document" is not available during server side rendering.
12:24:15 PM:
12:24:15 PM: > 1 | !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AOS=t():e.AOS=t()}(this,function(){return function(e){function t(o){if(n[o])return n[o].exports;var i=n[o]={exports:{},id:o,loaded:!1};return e[o].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="dist/",t(0)}([function(e,t,n){"use strict";function o(e){return e&&e.__esModule?e:{default:e}}var i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)Object.prototype.hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},r=n(1),a=(o(r),n(6)),u=o(a),c=n(7),s=o(c),f=n(8),d=o(f),l=n(9),p=o(l),m=n(10),b=o(m),v=n(11),y=o(v),g=n(14),h=o(g),w=[],k=!1,x={offset:120,delay:0,easing:"ease",duration:400,disable:!1,once:!1,startEvent:"DOMContentLoaded",throttleDelay:99,debounceDelay:50,disableMutationObserver:!1},j=function(){var e=arguments.length>0&&void
12:24:15 PM: | ^
12:24:15 PM:
12:24:15 PM: WebpackError: ReferenceError: document is not defined
12:24:15 PM:
12:24:15 PM: - aos.js:1
12:24:15 PM: node_modules/aos/dist/aos.js:1:14565
12:24:15 PM:
12:24:15 PM: - aos.js:1
12:24:15 PM: node_modules/aos/dist/aos.js:1:1506
12:24:15 PM:
12:24:15 PM: - Technologie.js:8
12:24:15 PM: src/components/Technologie.js:8:5
12:24:15 PM:
12:24:15 PM: - index.js:1
12:24:15 PM: src/pages/index.js:1:1
12:24:15 PM:
12:24:15 PM: - getLayoutRect.js:1
12:24:15 PM: node_modules/#popperjs/core/lib/dom-utils/getLayoutRect.js:1:1
12:24:15 PM:
12:24:15 PM:
12:24:15 PM: ​
12:24:15 PM: ┌─────────────────────────────┐
12:24:15 PM: │ "build.command" failed │
12:24:15 PM: └─────────────────────────────┘
12:24:15 PM: ​
12:24:15 PM: Error message
12:24:15 PM: Command failed with exit code 1: gatsby build
12:24:15 PM: ​
12:24:15 PM: Error location
12:24:15 PM: In Build command from Netlify app:
12:24:15 PM: gatsby build
12:24:15 PM: ​
12:24:15 PM: Resolved config
12:24:15 PM: build:
12:24:15 PM: command: gatsby build
12:24:15 PM: commandOrigin: ui
12:24:15 PM: publish: /opt/build/repo/public
12:24:15 PM: Caching artifacts
12:24:15 PM: Started saving node modules
12:24:15 PM: Finished saving node modules
12:24:15 PM: Started saving build plugins
12:24:15 PM: Finished saving build plugins
12:24:15 PM: Started saving pip cache
12:24:15 PM: Finished saving pip cache
12:24:15 PM: Started saving emacs cask dependencies
12:24:15 PM: Finished saving emacs cask dependencies
12:24:15 PM: Started saving maven dependencies
12:24:15 PM: Finished saving maven dependencies
12:24:15 PM: Started saving boot dependencies
12:24:15 PM: Finished saving boot dependencies
12:24:15 PM: Started saving go dependencies
12:24:15 PM: Finished saving go dependencies
12:24:18 PM: Error running command: Build script returned non-zero exit code: 1
12:24:18 PM: Failing build: Failed to build site
12:24:18 PM: Failed during stage 'building site': Build script returned non-zero exit code: 1
12:24:19 PM: Finished processing build request in 2m5.540557721s
Any suggestions? Thanks in advance.
There's a process misunderstanding there. In your repository, you should commit all files except your /public folder since it's the one that will be generated in the building and deploy process in Netlify. In addition, your netlify.toml is not adding any useful command to Netlify because they are added by default in the dashboard. As you can see in:
Note: you can find this configuration under https://app.netlify.com/sites/YOUR_PROJECT_NAME/settings/deploys
Your command is failing because you are doing the Netlify work in your repository. You are uploading a built folder (/public) that doesn't contain any package.json nor build commands so your command is unrecognized.
You must upload all files except your /public folder in your repository and let Netlify do the build process. In addition, you can improve your netlify.toml by removing the default commands.
With the new edited content it's inferred that
this build must fail locally too before pushing it to Netlify. In Gatsby, you have to check for the availability of the global objects (like window or document before using it).
It's a broad question and spreads the topic of it. If the error is in your code (you are using document object) you need to add a condition first:
If (typeof document !== 'undefined') {
//Your code here
}
If the error comes from an external source (library or dependency using window or document internally), you need to add a null loader in your webpack's configuration:
exports.onCreateWebpackConfig = ({ stage, loaders, actions }) => {
if (stage === "build-html") {
actions.setWebpackConfig({
module: {
rules: [
{
test: /bad-module/,
use: loaders.null(),
},
],
},
})
}
}
Replacing /bad-module/ for the library path in node_modules.
You can check for further details in Debugging HTML Builds Documentation
To add properly AOS package add this to your page/component:
componentDidMount() {
const AOS = require('aos');
this.aos = AOS this.aos.init()
}
componentDidUpdate() {
this.aos.refresh()
}
Or using hooks:
let AOS;
useEffect(() => {
/** * Server-side rendering does not provide the 'document' object
* therefore this import is required either in useEffect or componentDidMount as they
* are exclusively executed on a client */
const AOS = require("aos");
AOS.init({ once: true, }); }, []);
useEffect(() => { if (AOS) { AOS.refresh(); } });

Error when trying to deploy refactored app on Netlify

I've just refactored my app by creating a folder for each component with its .js and .scss file and on local it works fine (even the npm run build command).
The problem is now it gives me an error when I try to deploy it.
It says
5:25:44 PM: ./src/Components/restaurants/RestaurantInfo/RestaurantInfo.js
5:25:44 PM: Cannot find file '../../util/Review' in './src/Components/restaurants/RestaurantInfo'.
it doesn't find it because ./src/Components/restaurants/RestaurantInfo is now just a folder and it should check ./src/Components/restaurants/RestaurantInfo/RestaurantInfo instead.
I've checked all the paths and are correct, as I said on local everything works as it should but clearly something is wrong and I can't figure it out.
Here's the its url: https://restaurant-finder-redux.netlify.app/
Github repository: https://github.com/mugg84/RestaurantFinderRedux.git
and the full error:
5:25:41 PM: Build ready to start
5:25:43 PM: build-image version: ca811f47d4c1cbd1812d1eb6ecb0c977e86d1a1d
5:25:43 PM: build-image tag: v3.3.20
5:25:43 PM: buildbot version: be8ecf2af866e16fa4301cc5c14de2ccbbb21cf4
5:25:43 PM: Fetching cached dependencies
5:25:43 PM: Starting to download cache of 254.8KB
5:25:43 PM: Finished downloading cache in 74.189736ms
5:25:43 PM: Starting to extract cache
5:25:43 PM: Failed to fetch cache, continuing with build
5:25:43 PM: Starting to prepare the repo for build
5:25:44 PM: No cached dependencies found. Cloning fresh repo
5:25:44 PM: git clone git#github.com:mugg84/RestaurantFinderRedux
5:25:45 PM: Preparing Git Reference refs/heads/master
5:25:47 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'build' versus 'C:\Users\Turi\Desktop\project\RestaurantsRedux\build' in the Netlify UI
5:25:47 PM: Starting build script
5:25:47 PM: Installing dependencies
5:25:47 PM: Python version set to 2.7
5:25:48 PM: v12.18.0 is already installed.
5:25:49 PM: Now using node v12.18.0 (npm v6.14.4)
5:25:49 PM: Started restoring cached build plugins
5:25:49 PM: Finished restoring cached build plugins
5:25:49 PM: Attempting ruby version 2.7.1, read from environment
5:25:51 PM: Using ruby version 2.7.1
5:25:51 PM: Using PHP version 5.6
5:25:51 PM: 5.2 is already installed.
5:25:51 PM: Using Swift version 5.2
5:25:51 PM: Started restoring cached node modules
5:25:51 PM: Finished restoring cached node modules
5:25:51 PM: Installing NPM modules using NPM version 6.14.4
5:26:28 PM: > node-sass#4.14.1 install /opt/build/repo/node_modules/node-sass
5:26:28 PM: > node scripts/install.js
5:26:29 PM: Downloading binary from https://github.com/sass/node-sass/releases/download/v4.14.1/linux-x64-72_binding.node
5:26:29 PM: Download complete
5:26:29 PM: Binary saved to /opt/build/repo/node_modules/node-sass/vendor/linux-x64-72/binding.node
5:26:29 PM: Caching binary to /opt/buildhome/.npm/node-sass/4.14.1/linux-x64-72_binding.node
5:26:30 PM: > core-js#2.6.11 postinstall /opt/build/repo/node_modules/babel-runtime/node_modules/core-js
5:26:30 PM: > node -e "try{require('./postinstall')}catch(e){}"
5:26:30 PM: > core-js#3.6.5 postinstall /opt/build/repo/node_modules/core-js
5:26:30 PM: > node -e "try{require('./postinstall')}catch(e){}"
5:26:30 PM: > core-js-pure#3.6.5 postinstall /opt/build/repo/node_modules/core-js-pure
5:26:30 PM: > node -e "try{require('./postinstall')}catch(e){}"
5:26:31 PM: > node-sass#4.14.1 postinstall /opt/build/repo/node_modules/node-sass
5:26:31 PM: > node scripts/build.js
5:26:31 PM: Binary found at /opt/build/repo/node_modules/node-sass/vendor/linux-x64-72/binding.node
5:26:31 PM: Testing binary
5:26:31 PM: Binary is fine
5:26:33 PM: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.13 (node_modules/webpack-dev-server/node_modules/fsevents):
5:26:33 PM: npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
5:26:33 PM: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.13 (node_modules/watchpack-chokidar2/node_modules/fsevents):
5:26:33 PM: npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
5:26:33 PM: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.13 (node_modules/jest-haste-map/node_modules/fsevents):
5:26:33 PM: npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
5:26:33 PM: npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#2.1.2 (node_modules/fsevents):
5:26:33 PM: npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#2.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
5:26:33 PM: added 1778 packages from 828 contributors and audited 1782 packages in 40.593s
5:26:35 PM: 60 packages are looking for funding
5:26:35 PM: run `npm fund` for details
5:26:35 PM: found 4985 low severity vulnerabilities
5:26:35 PM: run `npm audit fix` to fix them, or `npm audit` for details
5:26:35 PM: NPM modules installed
5:26:35 PM: Started restoring cached go cache
5:26:35 PM: Finished restoring cached go cache
5:26:35 PM: go version go1.14.4 linux/amd64
5:26:35 PM: go version go1.14.4 linux/amd64
5:26:35 PM: Installing missing commands
5:26:35 PM: Verify run directory
5:26:37 PM: ​
5:26:37 PM: ┌─────────────────────────────┐
5:26:37 PM: │ Netlify Build │
5:26:37 PM: └─────────────────────────────┘
5:26:37 PM: ​
5:26:37 PM: ❯ Version
5:26:37 PM: #netlify/build 3.0.1
5:26:37 PM: ​
5:26:37 PM: ❯ Flags
5:26:37 PM: deployId: 5f19ba059db363022d8ef5d1
5:26:37 PM: mode: buildbot
5:26:37 PM: ​
5:26:37 PM: ❯ Current directory
5:26:37 PM: /opt/build/repo
5:26:37 PM: ​
5:26:37 PM: ❯ Config file
5:26:37 PM: /opt/build/repo/netlify.toml
5:26:37 PM: ​
5:26:37 PM: ❯ Context
5:26:37 PM: production
5:26:37 PM: ​
5:26:37 PM: ┌───────────────────────────────────┐
5:26:37 PM: │ 1. Build command from Netlify app │
5:26:37 PM: └───────────────────────────────────┘
5:26:37 PM: ​
5:26:37 PM: $ npm run build
5:26:37 PM: > RestaurantFinder#0.1.0 build /opt/build/repo
5:26:37 PM: > react-scripts build
5:26:38 PM: Creating an optimized production build...
5:26:44 PM: Failed to compile.
5:26:44 PM:
5:26:44 PM: ./src/Components/restaurants/RestaurantInfo/RestaurantInfo.js
5:26:44 PM: Cannot find file '../../util/Review' in './src/Components/restaurants/RestaurantInfo'.
5:26:44 PM: npm ERR! code ELIFECYCLE
5:26:44 PM: npm ERR! errno 1
5:26:44 PM: npm ERR! RestaurantFinder#0.1.0 build: `react-scripts build`
5:26:44 PM: npm ERR! Exit status 1
5:26:44 PM: npm ERR!
5:26:44 PM: npm ERR! Failed at the RestaurantFinder#0.1.0 build script.
5:26:44 PM: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
5:26:44 PM: npm ERR! A complete log of this run can be found in:
5:26:44 PM: npm ERR! /opt/buildhome/.npm/_logs/2020-07-23T16_26_44_363Z-debug.log
5:26:44 PM:
5:26:44 PM: If the build failed with a warning about "process.env.CI = true", this is due to "create-react-app" treating warnings as errors when in CI. In order to fix this problem, please either:
5:26:44 PM: - Fix the issues highlighted by the warnings above.
5:26:44 PM: - Or modify the "scripts.build" command in your "package.json" from "react-scripts build" to "CI= react-scripts build"
5:26:44 PM: More information can be found at https://docs.netlify.com/configure-builds/troubleshooting-tips/#build-fails-on-warning-message
5:26:44 PM: ​
5:26:44 PM: ┌─────────────────────────────┐
5:26:44 PM: │ "build.command" failed │
5:26:44 PM: └─────────────────────────────┘
5:26:44 PM: ​
5:26:44 PM: Error message
5:26:44 PM: Command failed with exit code 1: npm run build
5:26:44 PM: ​
5:26:44 PM: Error location
5:26:44 PM: In Build command from Netlify app:
5:26:44 PM: npm run build
5:26:44 PM: ​
5:26:44 PM: Resolved config
5:26:44 PM: build:
5:26:44 PM: command: npm run build
5:26:44 PM: commandOrigin: ui
5:26:44 PM: environment:
5:26:44 PM: - REACT_APP_GOOGLE_API_KEY
5:26:44 PM: - REACT_APP_MAILCHIMP_URL
5:26:44 PM: - REACT_APP_YELP_API_KEY
5:26:44 PM: publish: /opt/build/repo/build
5:26:44 PM: Caching artifacts
5:26:44 PM: Started saving node modules
5:26:44 PM: Finished saving node modules
5:26:44 PM: Started saving build plugins
5:26:44 PM: Finished saving build plugins
5:26:44 PM: Started saving pip cache
5:26:44 PM: Finished saving pip cache
5:26:44 PM: Started saving emacs cask dependencies
5:26:44 PM: Finished saving emacs cask dependencies
5:26:44 PM: Started saving maven dependencies
5:26:44 PM: Finished saving maven dependencies
5:26:44 PM: Started saving boot dependencies
5:26:44 PM: Finished saving boot dependencies
5:26:44 PM: Started saving go dependencies
5:26:44 PM: Finished saving go dependencies
5:26:47 PM: Error running command: Build script returned non-zero exit code: 1
5:26:47 PM: Failing build: Failed to build site
5:26:47 PM: Failed during stage 'building site': Build script returned non-zero exit code: 1
5:26:47 PM: Finished processing build request in 1m4.47397412s
Thanks for your help!
The issue was a discrepancy between the repository name of one folder and the local one, specifically the folder util.
In the repository it was uppercase, Util, while locally util and that was causing the issue.
That explains why locally npm run build was working bit it wasn't in deployment.

File structure and scripts for deploying next js app to netlify

Pretty new to useing Next JS and combined information from various tutorials, but stuck on what I am doing wrong with either file structure or the build process in general in order to have a successful deployment to Netlify.
In the nextjs tutorial they have you put pages in /pages directory at the root. But most tutorials with webpack have you put them in another directory, the /src. well for now I don't need to worry about webpack and just want to deploy the site.
Followed this tutorial https://medium.com/#azizhk/next-js-netlify-c246ea070ae2
in my package.json i have
"scripts": {
"dev": "next",
"build": "next build && next export",
"start": "serve ./out"
},
My Build Settings in Netlify
Where the build went wrong
6:32:04 PM: Error running command: Build script returned non-zero exit code: 127
6:32:04 PM: Failing build: Failed to build site
6:32:04 PM: failed during stage 'building site': Build script returned non-zero exit code: 127
Updated directory structure
Full notes of errors from build
6:31:16 PM: Build ready to start
6:31:30 PM: build-image version: 9e0f207a27642d0115b1ca97cd5e8cebbe492f63
6:31:30 PM: build-image tag: v3.3.2
6:31:30 PM: buildbot version: 8727aab446158e7b8c8ad2e96fe74b0154505a4e
6:31:30 PM: Fetching cached dependencies
6:31:31 PM: Starting to download cache of 2.0MB
6:31:31 PM: Finished downloading cache in 158.159923ms
6:31:31 PM: Starting to extract cache
6:31:31 PM: Finished extracting cache in 24.261695ms
6:31:31 PM: Finished fetching cache in 184.056316ms
6:31:31 PM: Starting to prepare the repo for build
6:31:31 PM: Preparing Git Reference refs/heads/master
6:31:32 PM: Starting build script
6:31:32 PM: Installing dependencies
6:31:33 PM: Downloading and installing node v10.16.3...
6:31:34 PM: Downloading https://nodejs.org/dist/v10.16.3/node-v10.16.3-linux-x64.tar.xz...
6:31:34 PM:
######################
6:31:34 PM: 31.2%
6:31:34 PM:
##################################################################
6:31:34 PM: 92.1%
6:31:34 PM:
########################################################################
6:31:34 PM: 100.0%
6:31:34 PM: Computing checksum with sha256sum
6:31:34 PM: Checksums matched!
6:31:38 PM: Now using node v10.16.3 (npm v6.9.0)
6:31:38 PM: Attempting ruby version 2.6.2, read from environment
6:31:39 PM: Using ruby version 2.6.2
6:31:39 PM: Using PHP version 5.6
6:31:39 PM: Started restoring cached node modules
6:31:39 PM: Finished restoring cached node modules
6:31:40 PM: Installing NPM modules using NPM version 6.9.0
6:31:59 PM: > core-js#2.6.10 postinstall /opt/build/repo/node_modules/core-js
6:31:59 PM: > node postinstall || echo "ignore"
6:31:59 PM: Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!
6:31:59 PM: The project needs your help! Please consider supporting of core-js on Open Collective or Patreon:
6:31:59 PM: > https://opencollective.com/core-js
6:31:59 PM: > https://www.patreon.com/zloirock
6:31:59 PM: Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)
6:31:59 PM: > styled-components#4.4.0 postinstall /opt/build/repo/node_modules/styled-components
6:31:59 PM: > node ./scripts/postinstall.js || exit 0
6:31:59 PM: Use styled-components at work? Consider supporting our development efforts at https://opencollective.com/styled-components
6:32:00 PM: npm WARN
6:32:00 PM: cityguide#1.0.0 No description
6:32:00 PM: npm WARN cityguide#1.0.0 No repository field.
6:32:00 PM: npm
6:32:00 PM: WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.9 (node_modules/fsevents):
6:32:00 PM: npm WARN
6:32:00 PM: notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
6:32:00 PM: added 1014 packages from 493 contributors and audited 19416 packages in 19.734s
6:32:00 PM: found 0 vulnerabilities
6:32:00 PM: NPM modules installed
6:32:01 PM: Started restoring cached go cache
6:32:01 PM: Finished restoring cached go cache
6:32:01 PM: unset GOOS;
6:32:01 PM: unset GOARCH;
6:32:01 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.12.linux.amd64';
6:32:01 PM: export PATH="/opt/buildhome/.gimme/versions/go1.12.linux.amd64/bin:${PATH}";
6:32:01 PM: go version >&2;
6:32:01 PM: export GIMME_ENV='/opt/buildhome/.gimme/env/go1.12.linux.amd64.env';
6:32:01 PM: go version go1.12 linux/amd64
6:32:01 PM: Installing missing commands
6:32:01 PM: Verify run directory
6:32:01 PM: Executing user command: yarn build
6:32:01 PM: /usr/local/bin/build: line 60: yarn: command not found
6:32:01 PM: Skipping functions preparation step: no functions directory set
6:32:01 PM: Caching artifacts
6:32:01 PM: Started saving node modules
6:32:01 PM: Finished saving node modules
6:32:01 PM: Started saving pip cache
6:32:01 PM: Finished saving pip cache
6:32:01 PM: Started saving emacs cask dependencies
6:32:01 PM: Finished saving emacs cask dependencies
6:32:01 PM: Started saving maven dependencies
6:32:01 PM: Finished saving maven dependencies
6:32:01 PM: Started saving boot dependencies
6:32:01 PM: Finished saving boot dependencies
6:32:01 PM: Started saving go dependencies
6:32:01 PM: Finished saving go dependencies
6:32:04 PM: Error running command: Build script returned non-zero exit code: 127
6:32:04 PM: Failing build: Failed to build site
6:32:04 PM: failed during stage 'building site': Build script returned non-zero exit code: 127
6:32:04 PM: Finished processing build request in 33.478673773s
You can use below script to deploy your app in netlify
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start",
"export": "next export",
"deploy": "yarn run build && yarn run export"
},
Here are netlify build settings.
If you are using npm then please write npm instead of yarn.

Resources