执行yarn build失败无法生成build文件夹求助

执行yarn build命令时失败，无法生成build文件夹，但yarn start可正常运行。当前环境信息：

• Node版本：v14.1.0
• Yarn版本：1.22.19

问题截图：

package.json内容：

{"name": "queenofraw","version": "0.1.0","private": true,"homepage": "https://ja.materiamx.com","main": "","dependencies": {"@babel/preset-react": "^7.18.6","@emotion/react": "^11.10.4","@emotion/styled": "^11.10.4","@fortawesome/fontawesome-svg-core": "^1.2.4","@fortawesome/free-regular-svg-icons": "^5.3.1","@fortawesome/free-solid-svg-icons": "^5.3.1","@fortawesome/react-fontawesome": "^0.1.3","@material-ui/core": "^3.0.1","@material-ui/icons": "^3.0.1","@mdi/svg": "^3.0.39","@mui/icons-material": "^5.10.3","@mui/material": "^5.10.3","@react-jvectormap/core": "^1.0.3","@rematch/core": "^0.6.0","@stripe/stripe-js": "^1.8.0","@testing-library/jest-dom": "^5.16.5","@testing-library/react": "^13.4.0","@testing-library/user-event": "^14.4.3","antd": "^3.10.4","axios": "^0.18.0","bootstrap": "^5.2.3","chart.js": "^4.1.1","classnames": "^2.2.6","country-list": "^2.1.0","echarts": "^4.2.0-rc.2","echarts-for-react": "^2.0.15-beta.0","err": "^2.1.12","events": "^2.0.0","formsy-react": "^1.1.4","image-to-base64": "^2.0.1","jquery": "^3.6.1","js-cookie": "^2.2.0","loadash": "^1.0.0","material-ui-table-edit": "^3.0.3","moment": "^2.22.0","namor": "^1.1.1","qs": "^6.9.4","query-parse": "^2.0.0","rc-queue-anim": "^1.6.7","react": "^16.4.2","react-bootstrap": "^2.7.0","react-chartjs-2": "^5.1.0","react-confirm": "^0.1.17","react-cookie": "^3.0.4","react-country-flag": "^1.0.1","react-dom": "^16.4.2","react-dropzone": "^7.0.1","react-fontawesome": "^1.6.1","react-google-recaptcha": "^2.1.0","react-icons": "^3.2.2","react-images-upload": "^1.2.3","react-inline-editing": "^1.0.10","react-jvectormap": "0.0.4","react-moment": "^0.8.3","react-redux": "^5.0.7","react-router-dom": "^4.2.2","react-router-redux": "^4.0.8","react-scripts": "^5.0.1","react-scroll": "^1.7.11","react-table": "^6.8.6","recharts": "^1.2.0","slick-carousel": "^1.8.1","socket.io-client": "1.7.0","superagent": "^4.0.0-beta.5","web-vitals": "^3.0.1","yarn": "1.22.19"},"scripts": {"start": "cross-env REACT_APP_SERVER=https://api-dev.materiamx.com react-scripts start","starts": "PORT=6500 REACT_APP_SERVER=http://localhost:5080  react-scripts start","sass:watch": "node-sass -w src/assets/scss/style.scss -o src/assets/css","sass:build": "node-sass src/assets/scss/style.scss -o src/assets/css --source-map true","dev": "npm-run-all --parallel start sass:watch","start:stag": "react-scripts start","build": "cross-env REACT_APP_SERVER=http://192.168.2.18:5080 react-scripts build","deploy": "aws s3 sync build/ s3://qor-mmx-static --acl public-read","stag:build": "REACT_APP_SERVER=https://api-dev.materiamx.com react-scripts build","prod:build": "REACT_APP_SERVER=https://api-dev.materiamx.com/ react-scripts build","stag": "yarn run stag:build && sls client deploy --stage staging --aws-profile qor --region us-east-1","prod": "yarn run prod:build && sls client deploy --stage production --aws-profile qor --region us-east-1","eject": "react-scripts eject"},"devDependencies": {"babel-cli": "^6.26.0","babel-plugin-transform-object-rest-spread": "^6.26.0","babel-plugin-transform-react-jsx-source": "^6.22.0","babel-preset-es2015": "^6.24.1","babel-preset-react": "^6.24.1","babel-preset-stage-0": "^6.24.1","cross-env": "^7.0.3","flow-bin": "^0.68.0","node-sass": "^8.0.0","npm-run-all": "^4.1.5","react-edit-inline": "^1.0.8","react-test-renderer": "^16.2.0","serverless-finch": "^2.2.0","serverless-single-page-app-plugin": "^1.0.2"},"jest": {},"browserslist": {"production": [">0.2%","not dead","not op_mini all"],"development": ["last 1 chrome version","last 1 firefox version","last 1 safari version"]}}

1. 获取完整错误日志 #

截图仅显示部分错误，先导出完整构建日志：

yarn build > build-error.log 2>&1

打开build-error.log查看具体报错信息，这是定位问题的核心依据。

2. 修复依赖版本冲突 #

项目中存在多处依赖版本不兼容：

• React v16.4.2 与 react-scripts v5.0.1 不兼容，react-scripts 5.x要求React版本≥16.14.0
• @testing-library/react v13.4.0 要求React版本≥16.14.0，与当前React版本冲突
• node-sass v8.0.0 不支持Node v14，Node 14适配的node-sass版本为4.14.x或6.x

执行以下命令降级依赖： #

# 降级react-scripts到兼容React 16.4.2的版本
yarn add react-scripts@3.4.4 --dev

# 降级测试库到兼容版本
yarn add @testing-library/jest-dom@4.2.4 @testing-library/react@9.5.0 @testing-library/user-event@7.2.1 --dev

# 降级node-sass到支持Node 14的版本
yarn add node-sass@6.0.1 --dev

3. 检查环境变量与路径配置 #

• 确认build命令中的REACT_APP_SERVER=http://192.168.2.18:5080地址可正常访问，部分项目会因API地址不可达导致构建失败
• 临时移除package.json中的homepage字段，测试是否因路径配置问题导致构建失败

4. 清理缓存后重新构建 #

yarn cache clean
rm -rf node_modules
rm yarn.lock
yarn install
yarn build

5. 调整Node版本 #

将Node版本升级到v14.21.x（Node 14的最新稳定版），避免版本边缘的兼容性问题。

内容的提问来源于stack exchange，提问作者ANANTHU C