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

Question

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

  

错误编译失败1次   来自UglifyJS的app.js   作业无效[app.js：131,42]
  意外的角色＆＃39;`＆＃39; [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行）：

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

示例：

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