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

Question

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

错误编译失败，出现1个错误
来自UglifyJS的app.js。
无效的分配[app.js：131,42]
意外字符'`'[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）（第90-93行）：

另一种选择是从插件的dist文件夹中导入/获取插件的缩小版本 。

例：

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