反应脚本构建 "Parse error on line 1"

Question

我已经用 "create-react-app" 创建了一个 React 应用程序，它运行通过 "npm start" 没问题，但是，当我尝试构建或部署到 Heroku 时，我从反应中得到一个错误-脚本 build.js 与日志：

-----> Build
       Running build

       > areaos-react@0.1.0 build /tmp/build_b6b622a1f46daa3af2d16fdb6ffb259a
       > react-scripts build

       Creating an optimized production build...
       Failed to compile.

       Parse error on line 1: 
       0.3(-1)
       ---^
       Expecting end of input, "ADD", "SUB", "MUL", "DIV", got unexpected "LPAREN"

我试过： -更新 npm 模块，包括反应脚本 -从 package.json 中删除 "react-scripts build" - 在 package.json

中将 "main" 更改为 "react-scripts start"

这是我的 package.json

{
  "name": "doggos-react",
  "version": "0.1.0",
  "engines": {
    "node": "8.9.3",
    "npm": "6.9.0"
  },
  "private": true,
  "dependencies": {
    "caniuse-lite": "^1.0.30000989",
    "chart.js": "^2.8.0",
    "chartjs-plugin-labels": "^1.1.0",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "gl-react": "^3.17.2",
    "glsl-fxaa": "^3.0.0",
    "glslify": "^7.0.0",
    "glslify-loader": "^2.0.0",
    "gsap": "^2.1.3",
    "jquery": "^3.4.1",
    "orbit-controls-es6": "^2.0.0",
    "pg": "^7.12.1",
    "postprocessing": "^6.6.0",
    "react": "^16.9.0",
    "react-addons": "^0.9.1-deprecated",
    "react-addons-update": "^15.6.2",
    "react-backdrop-filter": "^1.3.2",
    "react-bootstrap": "^0.32.4",
    "react-chartjs-2": "^2.7.6",
    "react-dom": "^16.9.0",
    "react-input-slider": "^4.0.1",
    "react-router-dom": "^4.3.1",
    "react-scripts": "^3.1.1",
    "react-svg-loader": "^3.0.3",
    "react-swipe": "^6.0.4",
    "react-tabulator": "^0.9.1",
    "swipe-js": "^2.2.0",
    "swipe-js-iso": "^2.1.5",
    "three": "^0.107.0",
    "three-gif-loader": "^1.1.0",
    "three-obj-loader": "^1.1.3",
    "three-svg-loader": "^0.1.0"
  },
  "main": "react-scripts start",
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "proxy": "https://my_backend_app.com",
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

我不知道该怎么做。错误消息对我来说毫无意义。

第1行解析错误发生在哪个文件上？当 "start" 脚本工作正常时，"react-scripts build" 到底在做什么可能会出错的事情？

我只需要这个应用程序在 heroku 上运行，无论它是一个构建还是只是运行通过 npm start 连接运行在本地都很好。我想修复此错误，但如果有人也可以指出我可以告诉 heroku 像我在本地那样做 "npm start" 的地方，那现在也可以使用。

Answer 1

事实证明，Create React 应用程序附带的 postcss-calc 模块存在错误。我通过忽略那个解析器解决了这个问题。我在我的 json 中设置它以删除解析器：

  "cssnano": {
    "preset": [
      "default",
      {
        "calc": false
      }
    ]
  },

已报告错误，我从 here

获得了解决方案

Answer 2

我来这里遇到了类似的问题（yarn start 工作正常，但 react-scripts build 在第 1 行给出了解析错误）。错误消息没有给我有用的信息，也没有指出实际错误的位置。 @Joseph Ghaida 关于 calc 错误的回答为我指明了正确的方向。就我而言，我没有遵循关于负数周围白色 space 的 css 规则：
calc(var(--square-diameter)*-3) 导致解析错误
calc(var(--square-diameter)* -3) 可以
calc(var(--square-diameter)*(-3)) 可以

反应脚本构建 "Parse error on line 1"

react-scripts build "Parse error on line 1"

heroku

node.js

reactjs

react-scripts

create-react-app