创建生产资产时 UglifyJS 的 Webpack 错误

Question

我正在使用 Webpack Encore（类似于 Webpack）来创建资产文件。创建开发文件时一切正常，但是当运行命令生成用于生产的缩小文件时，我收到错误。

ERROR Failed to compile with 1 errors
app.js from UglifyJS .
Invalid assignment [app.js:131,42]
Unexpected character '`' [app.js:10953,9]

问题似乎是由两个插件引起的：

jquery-asScrollable 和 jquery-asScrollbar 事实上，注释掉以下几行，该过程成功完成

require('jquery-asScrollable');
require('jquery-asScrollbar');

我的package.json文件

{
  "devDependencies": {
    "@symfony/webpack-encore": "^0.17.1",
    "animsition": "^4.0.2",
    "bootstrap": "4.0.0-beta.2",
    "jquery": "^3.2.1",
    "jquery-asScrollable": "^0.4.10",
    "jquery-asScrollbar": "^0.5.7",
    "jquery-mousewheel": "^3.1.13",
    "node-sass": "^4.7.2",
    "popper.js": "^1.12.9",
    "sass-loader": "^6.0.6",
    "webpack-notifier": "^1.5.0"
  }
}

更新：

app.js

require('jquery-asScrollable');
require('jquery-asScrollbar');
require('jquery-mousewheel');

知道问题出在哪里吗？

Answer 1

这两个插件使用 ES6 语法 - 在本例中为 模板文字。 Uglify 与 ES6 的大部分不兼容。您需要将这些插件复制到您的项目代码中（以便它们被您的 Babel 转译）或在您的 Babel 转译过程中取消排除它们各自的 node_modules 文件夹。

查看正在使用的模板文字（以及更多 ES6）here（第 90-93 行）：

另一种选择是 import/require 缩小版本 插件的 dist 文件夹。

示例：

require('node_modules/jquery-asScrollable/dist/jquery-asScrollable.min.js')

创建生产资产时 UglifyJS 的 Webpack 错误

Webpack error from UglifyJS when creating production assets

javascript

jquery

webpack

webpack-encore