heroku react-scripts构建“第1行解析错误”

jutyujz0 于 2023-01-21 发布在 React

关注(0)|答案(3)|浏览(178)

我已经使用"create-react-app"创建了一个React应用程序，它通过"npm start"运行良好，但是，当我尝试构建或部署到Heroku时，我从react-scripts 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"

我试过：- 更新包括React脚本的npm模块-从package.json中删除"React脚本构建"-将package.json中的"main"更改为"React脚本启动"
这是我的包. 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"
  ]
}

我不知道该怎么办。这个错误信息对我毫无意义。
第一行解析错误发生在哪个文件上？当"start"脚本正常工作时，"react-scripts build"到底在做什么？
我只需要这个应用程序在heroku上运行，无论它是一个构建或只是通过npm启动运行，这确实在本地运行得很好。我想修复这个错误，但如果有人也可以指出我在哪里，我可以告诉heroku做"npm启动"，因为我在本地做，现在也会工作。

heroku

来源：https://stackoverflow.com/questions/57688479/react-scripts-build-parse-error-on-line-1

3条答案

按热度按时间

lsmepo6l1#

结果发现Create React app附带的postcss-calc模块中有一个bug。我通过忽略该解析器解决了这个问题。我在json中设置了以下内容来删除解析器：

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

报告了一个错误，我从here获得了解决方案

赞(0）回复(0）举报 2023-01-21

hvvq6cgz2#

我也遇到过类似的问题（yarn start运行正常，但是react-scripts build在第一行出现了一个解析错误）。错误消息没有给我提供有用的信息，也没有指出实际错误的位置。@Joseph Ghaida关于calc bug的回答给我指出了正确的方向。在我的例子中，我没有遵守css关于负数周围空白的规则：
calc(var(--square-diameter)*-3)导致解析错误
calc(var(--square-diameter)* -3)可以
calc(var(--square-diameter)*(-3))可以

赞(0）回复(0）举报 2023-01-21

chhqkbe13#

我也遇到过类似的问题，所以来到这里寻找解决方案，但是忽略解析器的错误对我们来说不是一个好的解决方案。
我们试着乘以一个负数，就像这样：

calc(var(--vh, 1vh) * $screenHeightPercentage);

其中屏幕高度百分比为-150。
最后通过绝对化screenHeightPercentage并乘以-1使其工作，如下所示：

calc(-1 * calc(var(--vh, 1vh) * abs($screenHeightPercentage)));

我想要一个干净的函数来计算这个值，而不是把它粘贴到我们需要它的任何地方，所以我最终得到了这个：

@function vhCalc($screenHeightPercentage) {
    @if($screenHeightPercentage == 0) {
        @return 0;
    } @else {
        @if ($screenHeightPercentage > 0) {
            @return calc(var(--vh, 1vh) * abs($screenHeightPercentage));
        } @else {
            @return calc(-1 * calc(var(--vh, 1vh) * abs($screenHeightPercentage)));
        }
    }
}

赞(0）回复(0）举报 2023-01-21

我来回答

heroku react-scripts构建“第1行解析错误”

3条答案

相关问题

热门标签

最新问答