解决iview打包时UglifyJs报错的问题

使用npm run dev时运行是ok的,但是npm run build打包时iview报错,

如下:

原因是iview中使用了es6语法,然而uglifyJs是不支持的,打开我们的build/webpack.prod.conf.js文件,可以看到

// UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
},
sourceMap: config.build.productionSourceMap,
parallel: true
}),

已经提示了uglifyJs不支持es6.

解决方案:

在webpack.base.conf.js中,我们先在js编译的时候添加如下:

{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'),
resolve('test'),resolve('/node_modules/iview/src'),resolve('/node_modules/iview/packages')]
},

先让iview的es6语法经过babel来转换,然后在build/webpack.prod.conf.js中,注释掉原来的uglifyJs,引入外部的uglifyJs对js进行压缩混淆,代码如下:

// UglifyJs do not support ES6+, you can also use babel-minify for better treeshaking: https://github.com/babel/minify
// new webpack.optimize.UglifyJsPlugin({
// compress: {
// warnings: false
// },
// sourceMap: config.build.productionSourceMap,
// parallel: true
// }),
new UglifyJsPlugin({
// 使用外部引入的新版本的js压缩工具
parallel: true,
uglifyOptions: {
ie8: false,
ecma: 6,
warnings: false,
mangle: true,
// debug false
output: {
comments: false,
beautify: false,
// debug true
},
compress: {
// 在UglifyJs删除没有用到的代码时不输出警告
warnings: false,
// 删除所有的 `console` 语句
// 还可以兼容ie浏览器
drop_console:
true,
// 内嵌定义了但是只用到一次的变量
collapse_vars:
true,
// 提取出出现多次但是没有定义成变量去引用的静态值
reduce_vars:
true,
}
}
}),

当然我们要先引入外部插件:

const UglifyJsPlugin =
require('uglifyjs-webpack-plugin');

如此便可解决。

以上这篇解决iview打包时UglifyJs报错的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。

时间: 2018-03-05

关于maven打包时的报错: Return code is: 501 , ReasonPhrase:HTTPS Required

今天使用jenkins构建时,报以下错误 [ERROR] Failed to execute goal on project saas20: Could not resolve dependencies for project com.ipower365.saas:saas20:war:0.0.1-SNAPSHOT: Failed to collect dependencies at com.ipower365.saas:messageserviceimpl:jar:0.0.1-SNAPSHOT

解决vue-cli webpack打包开启Gzip 报错问题

前两天项目上线,用vue-cli npm run build命令打包,打包完成后我擦吓了一跳,15M.本来暂时不打算优化的,但是每次看着部署包这么大,想想还是先优化一下,让包好看点,免得以后出现心理阴影! 在把 map文件干掉后,发现webpack这打包的速度,也忒感人了.在进行不自动生成 map文件设置时,有看到webpack自带的productionGzip功能,索性就一次性一起鼓捣鼓捣. 下面是瞎鼓捣历程,差点就鼓捣不出来了. 1.在项目 根目录config/index.js中build内

安装python时MySQLdb报错的问题描述及解决方法

问题描述: windows安装python mysqldb时报错python version 2.7 required,which was not found in the registry 网上很多方案,比如方案一: Python3.x时, from _winreg import *  改为 from winreg import * 去掉下划线 import sys from _winreg import * # tweak as necessary version = sys.version

解决python使用list()时总是报错的问题

如下所示: Traceback (most recent call last): File "<stdin>", line 1, in <module> TypeError: 'list' object is not callable 刚开始学习python的时候,可能会由于命名的不注意,导致也方法一直用不了,原因是在声明变量对的时候和python内置方法冲突了,导致方法被重新定义了,这样一来,方法自然也就不存在了 解决办法: 先复制个其他的list c = l

三个思路解决laravel上传文件报错:413 Request Entity Too Large问题

最近一个项目当中,要求上传图片,并且限制图片大小,虽然在laravel当中已经添加了相关的表单验证来阻止文件过大的上传,然而当提交表单时,还没轮到laravel处理,nginx就先报错了.当你仔细看报错页面时,你会发现有nginx版本信息,经过分析,这报错是因为nginx的默认上传文件大小配置client_max_body_size只有2MB, 基于nginx验证比laravel验证要早,想要友好报错而不是直接显示413 Request Entity Too Large,那么就有三个思路去解决.

解决Django提交表单报错:CSRF token missing or incorrect的问题

1.在Django提交表单时报错:Django提交表单报错: CSRF token missing or incorrect 具体报错页面如下: 2.有道词典翻译后如下: 通常,当存在真正的跨站点请求伪造时,或者Django的CSRF机制没有被正确使用时,就会出现这种情况.至于邮递表格,你须确保: 您的浏览器正在接受cookie. 视图函数将一个请求传递给模板的呈现方法. 在模板中,每个POST表单中都有一个{% csrf_token %}模板标记,目标是一个内部URL. 如果您没有使用Csrf

执行Python程序时模块报错问题

1. 在执行python程序时遇到 'ModuleNotFoundError: No module named 'xxxxx'' : 例如: 图片中以导入第三方的 'requests' 模块为例,此报错提示找不到requests模块.在python中,有的 模块是内置的(直接导入就能使用)有的模块是第三方的,则需要安装完成后才能导入使用,若未 安装直接导入使用就会出现上述报错!这里介绍最快的解决方法: 1)通过 pip (python软件包工具) 来安装所需要使用的第三方模块: 打开cmd输入

解决IDEA配置tomcat启动报错问题

在配置servlet不同路径时遇上以下两个错误: java.lang.NoSuchMethodError: javax.servlet.ServletContext.getVirtualServerName()Ljava/lang/String:  java.lang.ClassNotFoundException: org.apache.jsp.index_jsp: 对于第一个问题,我上网查阅了很多资料后发现,可能是tomcat版本冲突导致,catalina log如下: 19-Feb-2018

解决maven启动Spring项目报错的问题

第一个问题 java.lang.ClassCastException: org.springframework.web.SpringServletContainerInitializer cannot be cast to javax.servlet.ServletContainerInitializer 出现原因主要是 javax.servlet-api 在运行时将spring容器当成了servlet容器出现类型转换错误. 解决方法: 在pom.xml文件中修改 javax.servlet-a