Deploying react app with craco on aws amplify - reactjs

I have a blocking issue since days
I tried to deploy this repo on aws amplify and the build fail:
https://github.com/metaplex-foundation/candy-machine-ui
Everything works perfect in local (yarn run dev and yarn run build)
But with amplify:
here the error
2023-01-24T15:12:12.674Z [INFO]: # Executing command: yarn run build
2023-01-24T15:12:12.803Z [INFO]: yarn run v1.22.0
2023-01-24T15:12:12.826Z [INFO]: $ craco build
2023-01-24T15:12:17.161Z [INFO]: Creating an optimized production build...
2023-01-24T15:13:44.769Z [INFO]: Failed to compile.
2023-01-24T15:13:44.771Z [INFO]: Failed to load config "react-app" to extend from.
Referenced from: /codebuild/output/src254071763/src/fake-mint/package.json
2023-01-24T15:13:44.772Z [INFO]:
2023-01-24T15:13:44.847Z [WARNING]: error Command failed with exit code 1.
2023-01-24T15:13:44.848Z [INFO]: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
2023-01-24T15:13:44.852Z [ERROR]: !!! Build failed
2023-01-24T15:13:44.853Z [ERROR]: !!! Non-Zero Exit Code detected
2023-01-24T15:13:44.853Z [INFO]: # Starting environment caching...
2023-01-24T15:13:44.853Z [INFO]: # Environment caching completed

Related

AWS Amplify React - Deployment and Authentication No Longer Working

I have a React application that I deployed to AWS Amplify which has been working just fine. I deployed the application in September of this year, and decided to make a minor HTML update yesterday. I tried to re-deploy the application but I am facing two issues: (1) First, I keep getting an error in the deployment process. You can see the end of the log of the error below:
...
...
2022-12-23T12:45:48.274Z [INFO]: npm ERR! code 127
2022-12-23T12:45:48.277Z [INFO]: npm ERR! path
/root/.nvm/versions/node/v16.19.0/lib/node_modules/#aws-amplify/cli/node_modules/babel-runtime/node_modules/core-js
npm ERR! command failed
npm ERR! command sh -c -- node -e "try{require('./postinstall')}catch(e){}"
npm ERR! sh: node: command not found
2022-12-23T12:45:48.277Z [INFO]: npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2022-12-23T12_42_58_395Z-debug-0.log
2022-12-23T12:45:48.340Z [WARNING]: Process exited with exit code: 127
2022-12-23T12:45:48.340Z [INFO]: ! Error patching NPM package '#aws-amplify/cli' to version 7.6.19
2022-12-23T12:45:48.346Z [INFO]: # Retrieving cache...
2022-12-23T12:45:55.639Z [INFO]: # Extracting cache...
2022-12-23T12:46:05.281Z [INFO]: # Extraction completed
2022-12-23T12:46:05.469Z [INFO]: # Retrieved cache
2022-12-23T12:46:38.486Z [INFO]: ## Starting Backend Build
# Starting phase: build
## Running amplify pull to generate aws-exports.js file for frontend
2022-12-23T12:46:43.354Z [INFO]: [31mInvalid feature flag configuration[39m
2022-12-23T12:46:43.356Z [INFO]: [31mThese feature flags are defined in the "amplify/cli.json" configuration file and are unknown to the currently running Amplify CLI:[39m
[31m - graphqltransformer.showfieldauthnotification[39m
[31mThis issue likely happens when the project has been pushed with a newer version of Amplify CLI, try updating to a newer version.[39m
[31mEnsure that the CI/CD pipeline is not using an older or pinned down version of Amplify CLI.[39m
[31mLearn more about feature flags: https://docs.amplify.aws/cli/reference/feature-flags[39m
2022-12-23T12:46:43.373Z [ERROR]: !!! Build failed
2022-12-23T12:46:43.373Z [ERROR]: !!! Non-Zero Exit Code detected
2022-12-23T12:46:43.373Z [INFO]: # Starting environment caching...
2022-12-23T12:46:43.374Z [INFO]: # Uploading environment cache artifact...
2022-12-23T12:46:43.486Z [INFO]: # Uploaded environment cache artifact
2022-12-23T12:46:43.487Z [INFO]: # Environment caching completed
Terminating logging...
...I tried to (1) delete node_modules, and run npm install again, but that was not successful. I noticed that the most recent aws-amplify/cli is a higher version than the one I am using, but I set the 7.6.19 version in the Build parameters in AWS, so I can't imagine that this is the issue. I upgraded the local cli to the current version, but that did not make a difference either.
The (2) second issue I am facing is that user authentication is no longer working when I run the application locally on my machine. I even reverted back to the commit that was working, and even that is not able to allow users to login. Keep in mind the version in production is just fine (and its the same version as the commit I tried locally).
My question is: What do these errors have in common, and can you suggest a path forward to address this?

Module not found: Error: Can't resolve 'bootstrap/dist/css/bootstrap.css' in '/codebuild/output/src489574561/src/user-management-frontend/src'

I'm trying to deploy a React App in AWS Amplify but during the Build process, AWS Amplify throws below error:
Module not found: Error: Can't resolve 'bootstrap/dist/css/bootstrap.css' in '/codebuild/output/src489574561/src/user-management-frontend/src'
I'm wondering how to solve this error by changing something in code or need to configure AWS Amplify.
Full log trace is here:
# Starting phase: preBuild
# Executing command: npm ci
2022-09-07T06:11:29.303Z [INFO]: > core-js#3.25.0 postinstall /codebuild/output/src489574561/src/user-management-frontend/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"
2022-09-07T06:11:29.350Z [INFO]: [96mThank you for using core-js ([94m https://github.com/zloirock/core-js [96m) for polyfilling JavaScript standard library![0m
[96mThe project needs your help! Please consider supporting of core-js:[0m
[96m>[94m https://opencollective.com/core-js [0m
[96m>[94m https://patreon.com/zloirock [0m
[96m>[94m bitcoin: bc1qlea7544qtsmj2rayg0lthvza9fau63ux0fstcz [0m
[96mAlso, the author of core-js ([94m https://github.com/zloirock [96m) is looking for a good job -)[0m
2022-09-07T06:11:29.558Z [INFO]: > core-js-pure#3.25.0 postinstall /codebuild/output/src489574561/src/user-management-frontend/node_modules/core-js-pure
> node -e "try{require('./postinstall')}catch(e){}"
2022-09-07T06:11:29.895Z [INFO]: added 1501 packages in 21.092s
2022-09-07T06:11:29.908Z [INFO]: # Completed phase: preBuild
# Starting phase: build
2022-09-07T06:11:29.908Z [INFO]: # Executing command: npm run build
2022-09-07T06:11:30.074Z [INFO]: > user-management-frontend#0.1.0 build /codebuild/output/src489574561/src/user-management-frontend
> react-scripts build
2022-09-07T06:11:31.296Z [INFO]: Creating an optimized production build...
2022-09-07T06:11:31.983Z [INFO]: Failed to compile.
2022-09-07T06:11:31.983Z [INFO]: Module not found: Error: Can't resolve 'bootstrap/dist/css/bootstrap.css' in '/codebuild/output/src489574561/src/user-management-frontend/src'
2022-09-07T06:11:31.994Z [WARNING]: npm
2022-09-07T06:11:31.994Z [WARNING]: ERR! code ELIFECYCLE
npm ERR! errno 1
2022-09-07T06:11:31.996Z [WARNING]: npm
2022-09-07T06:11:31.996Z [WARNING]: ERR! user-management-frontend#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the user-management-frontend#0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2022-09-07T06:11:32.000Z [WARNING]:
2022-09-07T06:11:32.000Z [WARNING]: npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2022-09-07T06_11_31_997Z-debug.log
2022-09-07T06:11:32.000Z [HELP]: Outputting the npm debug log
[object Promise]
2022-09-07T06:11:32.003Z [ERROR]: !!! Build failed
2022-09-07T06:11:32.003Z [ERROR]: !!! Non-Zero Exit Code detected
2022-09-07T06:11:32.003Z [INFO]: # Starting environment caching...
2022-09-07T06:11:32.004Z [INFO]: # Environment caching completed
Terminating logging...
Try installing bootstrap, that's how I solved it.
npm install bootstrap --save

My react project don't build. Creating an optimized production build... Failed to compile

vuexy-react-admin-dashboard#1.0.0 build
react-app-rewired build
Creating an optimized production build...
Failed to compile.
The 'compilation' argument must be an instance of Compilat
my project works in npm start, but it dosen't work npm run build

Problem with yarn dependencies and material ui component in AWS

I try to deploy my react app in AWS Amplify but i have this problem during the build :
2021-02-14T09:27:15.885Z [INFO]: Creating an optimized production build...
2021-02-14T09:27:17.657Z [INFO]: Failed to compile.
2021-02-14T09:27:17.662Z [INFO]: ./src/App.js
Cannot find module: '#material-ui/core/Grid'. Make sure this package is installed.
You can install this package by running: yarn add #material-ui/core/Grid.
2021-02-14T09:27:17.702Z [WARNING]: error Command failed with exit code 1.
2021-02-14T09:27:17.703Z [INFO]: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
2021-02-14T09:27:17.708Z [ERROR]: !!! Build failed
2021-02-14T09:27:17.708Z [ERROR]: !!! Non-Zero Exit Code detected
The component '#material-ui/core/Grid' could not be found, i try to make a local build of the same code succesfully and i don't know why i have this in AWS.
My dependencies in package.json :
"material-ui": "^0.20.2",
"material-ui-core": "^5.0.1"
I really can't find any error on my code, so what is the problem ?
Thanks in advance
I solve the problem by using
yarn add #material-ui/core
maybe it's different from using
yarn add #material-ui-core

Why does AWS-Amplify build fails when Auth feature is added

I just recently started using Amazon's AWS basic plan, I am using the AWS-Amplify for uploading react applications and I usually used yarn with create react-app. I am not sure if it has conflicts with the AWS tutorial using npm but I got it right and had success with the building and deployment. However, when I added the Auth functionalities it only worked on my local but the build fails on deployment. This is the error log:
2020-06-23T17:07:34.078Z [INFO]: Git SSH Key acquired
2020-06-23T17:07:34.155Z [INFO]: # Cloning repository: git#github.com:mav1283/amplifyapp.git
2020-06-23T17:07:34.273Z [INFO]: Agent pid 131
2020-06-23T17:07:34.329Z [INFO]: Identity added: /root/.ssh/git_rsa (/root/.ssh/git_rsa)
2020-06-23T17:07:34.558Z [INFO]: Cloning into 'amplifyapp'...
2020-06-23T17:07:35.697Z [INFO]: Warning: Permanently added the RSA host key for IP address '13.229.188.59' to the list of known hosts.
2020-06-23T17:07:38.298Z [INFO]: # Switching to commit: 2d93cd9fca8f302a1390bce33985acccf97a8263
2020-06-23T17:07:38.388Z [INFO]: Note: checking out '2d93cd9fca8f302a1390bce33985acccf97a8263'.
You are in 'detached HEAD' state. You can look around, make experimental
changes and commit them, and you can discard any commits you make in this
state without impacting any branches by performing another checkout.
If you want to create a new branch to retain commits you create, you may
do so (now or later) by using -b with the checkout command again. Example:
git checkout -b <new-branch-name>
HEAD is now at 2d93cd9 add auth
2020-06-23T17:07:38.389Z [INFO]: # Checking for Git submodules at: /codebuild/output/src043707224/src/amplifyapp/.gitmodules
2020-06-23T17:07:38.411Z [INFO]: # Retrieving cache...
2020-06-23T17:07:40.086Z [INFO]: # Extracting cache...
2020-06-23T17:07:43.479Z [INFO]: # Extraction completed
2020-06-23T17:07:43.604Z [INFO]: # Retrieving environment cache...
2020-06-23T17:07:43.642Z [INFO]: # Retrieved environment cache
2020-06-23T17:08:17.476Z [INFO]: ## Starting Frontend Build
# Starting phase: preBuild
# Executing command: yarn install
2020-06-23T17:08:18.203Z [INFO]: yarn install v1.16.0
2020-06-23T17:08:18.305Z [INFO]: [1/4] Resolving packages...
2020-06-23T17:08:18.838Z [INFO]: [2/4] Fetching packages...
2020-06-23T17:08:48.710Z [INFO]: info fsevents#2.1.2: The platform "linux" is incompatible with this module.
2020-06-23T17:08:48.712Z [INFO]: info "fsevents#2.1.2" is an optional dependency and failed compatibility check. Excluding it from installation.
2020-06-23T17:08:48.719Z [INFO]: info fsevents#1.2.13: The platform "linux" is incompatible with this module.
2020-06-23T17:08:48.723Z [INFO]: info "fsevents#1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents#2.1.3: The platform "linux" is incompatible with this module.
info "fsevents#2.1.3" is an optional dependency and failed compatibility check. Excluding it from installation.
2020-06-23T17:08:48.728Z [INFO]: [3/4] Linking dependencies...
2020-06-23T17:08:48.732Z [WARNING]: warning "#aws-amplify/ui-react > #aws-amplify/ui-components#0.5.2" has unmet peer dependency "#aws-amplify/auth#^2.1.5".
warning "#aws-amplify/ui-react > #aws-amplify/ui-components#0.5.2" has unmet peer dependency "#aws-amplify/core#^2.2.4".
warning "#aws-amplify/ui-react > #aws-amplify/ui-components#0.5.2" has unmet peer dependency "#aws-amplify/xr#^1.1.5".
warning " > #testing-library/user-event#7.2.1" has unmet peer dependency "#testing-library/dom#>=5".
2020-06-23T17:08:48.734Z [WARNING]: warning "aws-amplify > #aws-amplify/api#3.1.17" has incorrect peer dependency "#aws-amplify/pubsub#^2.1.1".
warning "aws-amplify > #aws-amplify/datastore#2.2.4" has unmet peer dependency "#react-native-community/netinfo#^5.5.0".
warning "aws-amplify > #aws-amplify/api > #aws-amplify/api-graphql#1.1.0" has incorrect peer dependency "#aws-amplify/pubsub#^2.1.1".
2020-06-23T17:08:48.736Z [WARNING]: warning "react-scripts > #typescript-eslint/eslint-plugin > tsutils#3.17.1" has unmet peer dependency "typescript#>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
2020-06-23T17:08:56.100Z [INFO]: [4/4] Building fresh packages...
2020-06-23T17:08:57.025Z [INFO]: Done in 38.83s.
2020-06-23T17:08:57.047Z [INFO]: # Completed phase: preBuild
# Starting phase: build
# Executing command: yarn run build
2020-06-23T17:08:57.210Z [INFO]: yarn run v1.16.0
2020-06-23T17:08:57.237Z [INFO]: $ react-scripts build
2020-06-23T17:08:58.125Z [INFO]: Creating an optimized production build...
2020-06-23T17:08:59.577Z [INFO]: Failed to compile.
2020-06-23T17:08:59.579Z [INFO]: ./src/index.js
Cannot find file './aws-exports' in './src'.
2020-06-23T17:08:59.596Z [WARNING]: error Command failed with exit code 1.
2020-06-23T17:08:59.597Z [INFO]: info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
2020-06-23T17:08:59.602Z [ERROR]: !!! Build failed
2020-06-23T17:08:59.677Z [ERROR]: !!! Non-Zero Exit Code detected
2020-06-23T17:08:59.677Z [INFO]: # Starting environment caching...
2020-06-23T17:08:59.678Z [INFO]: # Environment caching completed
Terminating logging...
Creating the service role and changing the CLI version worked for me. If you do one and not the other you will not solve the problem. So create the service role and update the CLi version in the advanced settings to latest. That will work like magic.
For security reasons aws-exports.js is added to git ignore by default on amplify projects. This file is generated when you run the amplify push command.
backend:
phases:
# IMPORTANT - Please verify your build commands
build:
commands:
- '# Execute Amplify CLI with the helper script'
- amplifyPush --simple
Make sure you have amplifyPush --simple on your Build Settings -> amplify.yml file so you generate aws-exports on your amplify builds

Resources