打包 React 应用程序时如何解决 "Unexpected Token Operator (>)" 错误？

Question

我在为 React 应用构建可分发包时遇到了一些问题。

我正在尝试执行以下句子：

rimraf dist && env-cmd .env cross-env NODE_ENV=production webpack -p --config ./config/webpack/prod.js

并收到此错误：

ERROR in a86e50ffd4893c44fdfd.app.js from UglifyJs Unexpected token:
operator (>) [a86e50ffd4893c44fdfd.app.js:10679,43]

该跟踪中指示的行对应于作为依赖项加载的库之一，而不是我的应用程序的实际代码。这是行本身（第10679行对应带箭头函数的const方法的声明）：

const DEFAULT_DISPLAY_LABEL_FOR_NULL_VALUES = '';
/* unused harmony export DEFAULT_DISPLAY_LABEL_FOR_NULL_VALUES */

const getAllColumnLabels = (columnLabels) => {
    const columnNames = [];
    columnLabels.forEach((value) => {
        columnNames.push(value.label);
    });
    return columnNames;
};

起初我认为它可能与 Babel 配置有关，但它与正在正确构建的另一个项目相同。我的 .babelrc 文件的内容如下所示，使用 babel-preset-env:

加载

{
  "presets": [
    [
      "env", {
        "modules": false,
        "targets": {
          "browsers": [
            "Chrome >= 52",
            "FireFox >= 44",
            "Safari >= 7",
            "Explorer 11",
            "last 4 Edge versions"
          ]
        },
        "useBuiltIns": true
      }
    ]
  ]
}

已使用 Babel 的默认预设进行了排除某些可能性的额外测试，但此测试未取得成功。

{
  "presets": [
    [
      "env",
      {
        "modules": false
      }
    ]
  ]
}

tsconfig.json 中的设置也可能很有趣，所以我在这里展示它们，尽管它们也与上面提到的另一个项目中的设置相同，可以正确构建：

{
  "compilerOptions": {
    "target": "es6",
    "module": "es6",
    "lib": ["dom", "es2017"],
    "moduleResolution": "node",
    "declaration": false,
    "noImplicitAny": false,
    "sourceMap": true,
    "jsx": "react",
    "noLib": false,
    "allowJs": true,
    "suppressImplicitAnyIndexErrors": true,
    "skipLibCheck": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
  },
  "compileOnSave": true,
  "exclude": [
    "node_modules",
    "**/*.spec.ts"
  ]
}

我尝试删除 node_modules 并重新安装依赖项，还在 Babelrc 的环境中将 uglify 设置为 false，但令人惊讶的是（至少，我！）它没有帮助。

有一个 thread in the webpack-contrib Github 站点被标记为已关闭，但我没有找到任何对我有帮助的东西。

有什么想法吗？我对 npm 有一些经验，但这个问题肯定让我很困扰。

谢谢！

Answer 1

将 webpack 更新到版本 4（当前为 4.17）解决了问题。需要更新一些其他依赖项才能与 webpack 4 一起正常工作，最重要的是 Extract Text Webpack Plugin 目前还没有一个与 webpack4 一起工作的稳定版本，但是 4.0.0-beta 解决了这个问题并且可能是直到找到更好的替代品。

打包 React 应用程序时如何解决 "Unexpected Token Operator (>)" 错误？

How to workaround the "Unexpected Token Operator (>)" error when packaging a React app?

npm

webpack

uglifyjs