文档章节

使用iview-project 打包build报错,ERROR in xxxxx.cheunk.js from UglifyJs

o
 osc_a22drz29
发布于 2019/03/26 17:26
字数 357
阅读 36
收藏 0

钉钉、微博极速扩容黑科技,点击观看阿里云弹性计算年度发布会!>>>

一、iview-project  为iview官方推荐工程,一个基于iview的vue脚手架

  github网址:https://github.com/iview/iview-project

   废话不多说,直接进入主题

 

二、build报错及原因

  1、报错

   大部分报错内容  ERROR in xxxxx.cheunk.js from UglifyJs

 

2、原因:iview中使用了es6语法,然而uglifyJs是不支持的,为什么不支持?我们看下webpack的版本

 

iview-project  最大的坑就在这里,现在webpack版本都4+了,但是工程里用的webpack2,不支持es6语法,不支持那就配置一下

 

三、解决:

1、在webpack.base.conf.js中   修改js编译代码

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

 

让iview的es6语法经过babel来转换

2、webpack.prod.conf.js中  注释原来的   new webpack.optimize.UglifyJsPlugin({....})   

下载  uglifyjs-webpack-plugin  插件

npm install   uglifyjs-webpack-plugin --save-dev

下载后引入   

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

添加如下配置:

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,
                }
            }
        }),

 

好了,这样build就不报错了,可以直接打包了

 

o
粉丝 0
博文 500
码字总数 0
作品 0
私信 提问
加载中
请先登录后再评论。
在npm上发布自己的vue组件库(使用npm install 或者 CDN的方式引用)

一、npm publish 发布包到npm库的命令是npm publish npm publish发布包,需要先配置webpack.json文件,如果没有webpack.json文件,可以通过npm init命令初始化一个 package.json的部分字段简...

osc_o48qx32p
2019/09/02
7
0
webpack vue 打包一直再报es6 的 问题?

npm ERR! Exit status 1 ERROR in static/js/0.1f806b0b6172f1f7121b.js from UglifyJs Unexpected token: punc (() [static/js/0.1f806b0b6172f1f7121b.js:141,6] npm ERR! This is probabl......

wanghahah
2019/04/24
310
1
在webpack3里使用uglifyjs

环境:webpac<4的场景下,安装uglifyjs。 cnpm install uglifyjs-webpack-plugin -D 安装完毕后,去npm里查看uglifyjs的使用方法并添加到代码中: const UglifyJsPlugin = require('uglifyjs......

osc_keofad7g
2018/12/13
5
0
Vue打包报错Unexpected token: punc(()解决方案

(用vscode)vue项目打包时,报错,报错信息如下: ERROR in static/js/0.564c764efc3ecf31190c.js from UglifyJsUnexpected token: punc (() [App.vue?4b081dc6:15,0][static/js/0.564c764......

osc_t2p8k4ja
2019/03/27
15
0
vuecli3代码压缩混淆

最近被某大公司大佬虐了,要求混淆用vuecli3写的代码(啥敏感信息都没有,混淆个什么混淆...) 言归正传,现将混淆流程记录如下: 1、安装 “uglifyjs-webpack-plugin” cnpm i --save ugli...

osc_nd4uekgu
2019/05/31
24
0

没有更多内容

加载失败,请刷新页面

加载更多

漫画 | 韭菜的自我修养!

osc_0vfknl5u
4分钟前
0
0
[Java] 使用ZipInputStream解析zip类文件(jar、docx)的范例

作者: zyl910 一、缘由 现在zip类的文件越来越多了,例如jar、docx。 有时我们需批量处理这些文件中的数据,若都是手工操作的话就太麻烦了。于是考虑编程自动处理。 Java提供了ZipInputStr...

osc_7dn4hojn
5分钟前
0
0
Java常用类-String类

字符串相关的类:String String类:代表字符串,Java 程序中的所有字符串字面值(如 "abc" )都作 为此类的实例实现。 String是一个final类,代表不可变的字符序列 当字符串重新赋值时,需要...

osc_mgvk29y5
7分钟前
0
0
Python处理json模块的详细介绍

前言 本文的文字及图片来源于网络,仅供学习、交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理。 首先,了解下什么是JSON? JSON:JavaScript Object Notatio...

osc_7bkuddw5
8分钟前
0
0
Go的100天之旅-04基础数据类型

基础数据类型 在变量的定义中,我们讲了每个变量是有类型的,类型在计算机中是用来约束数据的解释。Go语言和其它计算机语言一样,提供丰富了丰富的数据类型,我们就来看看到底有哪些类型,同...

osc_aazzok95
10分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部