打包React应用时如何解决“意外的令牌运算符(>)”错误?

时间:2018-09-05 08:07:59

标签: npm webpack uglifyjs

在为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有一定的经验,但是这个问题肯定使我受阻。

谢谢!

1 个答案:

答案 0 :(得分:0)

将webpack更新到版本4(当前为4.17)解决了该问题。为了与webpack 4一起正常工作,还需要更新一些其他依赖项,最重要的是,Extract Text Webpack插件目前还没有与webpack4兼容的稳定版本,但是4.0.0-beta可以解决此问题,并且可能是直到找到更好的替代品为止。