error code ELIFECYCLE while running npm run build - reactjs

Question

I have built react app based on fuse react theme it is running fine in the dev environment by npm start
but I'm getting error while making production build, running npm run build to make a production build but getting ELIFECYCLE error, I have tried all the options like.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! fuse-react-app#6.1.4 build: `cross-env
GENERATE_SOURCEMAP=false craco build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the fuse-react-app#6.1.4 build script.
npm ERR! This is probably not a problem with npm. There is likely
additional logging output above.
Remove package-lock.json
Delete node_modules
Ran npm install
Ran npm start and app is working fine I can access the app on the browser
Ran npm run build getting ELIFECYCLE error
Here is my package.json file
{
"name": "fuse-react-app",
"version": "6.1.4",
"private": true,
"dependencies": {
"#date-io/core": "1.3.13",
"#date-io/date-fns": "1.3.13",
"#date-io/moment": "1.3.13",
"#fullcalendar/core": "5.7.0",
"#fullcalendar/daygrid": "5.7.0",
"#fullcalendar/interaction": "5.7.0",
"#fullcalendar/react": "5.7.0",
"#fullcalendar/timegrid": "5.7.0",
"#hookform/resolvers": "2.5.1",
"#material-ui/core": "4.11.4",
"#material-ui/data-grid": "latest",
"#material-ui/icons": "4.11.2",
"#material-ui/lab": "4.0.0-alpha.58",
"#material-ui/pickers": "3.3.10",
"#mui/material": "^5.2.4",
"#mui/x-data-grid-pro": "^4.0.0",
"#reduxjs/toolkit": "1.5.1",
"apexcharts": "3.26.3",
"auth0-lock": "11.30.0",
"autosuggest-highlight": "3.1.1",
"axios": "0.21.1",
"axios-mock-adapter": "1.19.0",
"chart.js": "2.9.4",
"clsx": "1.1.1",
"cross-fetch": "3.1.4",
"date-fns": "2.21.3",
"draft-js": "0.11.7",
"draftjs-to-html": "0.9.1",
"firebase": "8.6.2",
"formsy-react": "2.2.5",
"framer-motion": "4.1.17",
"google-map-react": "2.1.9",
"history": "4.10.1",
"i18next": "20.3.0",
"jsonwebtoken": "8.5.1",
"jss": "10.6.0",
"jss-plugin-extend": "10.6.0",
"jss-rtl": "0.3.0",
"jwt-decode": "2.2.0",
"keycode": "2.2.0",
"lodash": "4.17.21",
"marked": "0.8.2",
"material-table": "^1.69.3",
"material-ui-dropzone": "^3.5.0",
"material-ui-popup-state": "1.8.3",
"millify": "^4.0.0",
"mobile-detect": "1.4.5",
"moment": "^2.29.1",
"notistack": "1.0.9",
"path-to-regexp": "3.2.0",
"perfect-scrollbar": "1.5.1",
"prismjs": "1.23.0",
"prop-types": "15.7.2",
"qs": "6.10.1",
"raw-loader": "4.0.2",
"react": "17.0.2",
"react-apexcharts": "1.3.9",
"react-autosuggest": "10.1.0",
"react-beautiful-dnd": "13.1.0",
"react-chartjs-2": "2.11.2",
"react-compound-timer": "^1.2.0",
"react-dom": "17.0.2",
"react-draft-wysiwyg": "1.14.7",
"react-draggable": "4.4.3",
"react-frame-component": "4.1.3",
"react-hook-form": "7.7.1",
"react-i18next": "11.9.0",
"react-iframe": "^1.8.0",
"react-json-editor-ajrm": "^2.5.13",
"react-json-view": "^1.21.3",
"react-masonry-css": "1.0.16",
"react-number-format": "4.5.5",
"react-popper": "1.3.11",
"react-redux": "7.2.4",
"react-router": "5.2.0",
"react-router-config": "5.1.1",
"react-router-dom": "5.2.0",
"react-scripts": "^4.0.3",
"react-select": "3.2.0",
"react-show-more-text": "^1.5.0",
"react-sparklines": "^1.7.0",
"react-spring": "9.1.2",
"react-swipeable": "6.1.2",
"react-swipeable-views": "0.13.9",
"react-swipeable-views-utils": "0.13.9",
"react-table": "7.7.0",
"react-terminal-component": "^1.5.0",
"react-text-mask": "5.4.3",
"react-virtualized": "9.22.3",
"react-window": "1.8.6",
"redux": "4.1.0",
"redux-logger": "4.0.0",
"styled-components": "5.3.0",
"typeface-poppins": "1.1.13",
"velocity-animate": "1.5.2",
"velocity-react": "1.4.3",
"web-vitals": "^0.2.4",
"yup": "0.32.9"
},
"peerDependencies": {
"autoprefixer": "9.8.6",
"postcss": "7.0.35",
"react": "17.0.2",
"react-dom": "17.0.2"
},
"resolutions": {
"react": "17.0.2",
"react-dom": "17.0.2",
"babel-loader": "8.1.0"
},
"devDependencies": {
"#babel/core": "7.12.17",
"#babel/node": "7.12.17",
"#babel/plugin-transform-react-jsx": "7.12.17",
"#babel/preset-env": "7.12.17",
"#craco/craco": "^6.1.2",
"#tailwindcss/postcss7-compat": "2.1.2",
"#typescript-eslint/eslint-plugin": "^4.25.0",
"#typescript-eslint/parser": "^4.25.0",
"#yarnpkg/pnpify": "2.4.0",
"autoprefixer": "9.8.6",
"babel-eslint": "10.1.0",
"cross-env": "7.0.3",
"eslint": "7.27.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-prettier": "^8.3.0",
"eslint-config-react-app": "^6.0.0",
"eslint-import-resolver-node": "^0.3.4",
"eslint-plugin-flowtype": "^5.7.2",
"eslint-plugin-import": "^2.23.3",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-react": "^7.23.2",
"eslint-plugin-react-hooks": "^4.2.0",
"js-beautify": "1.13.13",
"postcss": "7.0.35",
"prettier": "^2.3.0",
"promise": "8.1.0",
"source-map-explorer": "2.5.2",
"tailwindcss": "npm:#tailwindcss/postcss7-compat#2.1.2",
"tailwindcss-dir": "4.0.0"
},
"scripts": {
"start": "craco start",
"build": "cross-env GENERATE_SOURCEMAP=false craco build",
"test": "craco test --env=node",
"eject": "craco eject",
"build-docs": "find ./src/app/main/documentation/material-ui-components \\( -name '*.ts' -o -name '*.tsx' \\) -type f -delete && babel-node --presets #babel/preset-env src/app/main/documentation/material-ui-components/build.js",
"analyze": "craco build && source-map-explorer 'build/static/js/*.js' --html analyze-result.html",
"pnpify-sdk": "yarn pnpify --sdk",
"lint": "eslint"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 3 safari version"
]
}}
Node version = 14.2.0
npm version = 6.14.4
Any solution how can I resolve the above error and make a production build.

Answer 1

I think the main reason is the using cross-env package. Otherwise other scripts would cause same error, too.
FOr testing purpose, remove cross-env GENERATE_SOURCEMAP=false and pass false manually instead of process.env.GENERATE_SOURCEMAP. so your build script should be
"build": "craco build",
if it does not work, clean the cache
npm cache clean –force
delete .npm
rm -rf ~/.npm
then delete lock.json and node_modules, and reinstall
npm install