vue打包遇到的UglifyJs问题
今天准备打包最近手头正在做的一个vue项目到测试环境跑一下,顺便测试一下,可是不想打包的时候出现了
ERROR in static/js/vendor.6ee331eab7d8c9bf1876.js from UglifyJs
Unexpected token name «i», expected punc «;» [static/js/vendor.6ee331eab7d8c9bf1876.js:17007,11]Build failed with errors.npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! client@1.0.0 build: `node build/build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the client@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache\_logs\2017-12-15T13_29_31_598Z-debug.log
起初也没太在意,直接把打好的包拿过去到nginx测试环境下一跑,谷歌浏览器下,还真没什么问题。本来打包也是为了测试一下,就顺带看了一眼ie,不看不知道,一看问题就来了,ie(包括ie11)下,页面一片空白,报了如下错误:
这可吓我一跳了,毕竟公司这个系统需要兼容到ie9的,于是乎,只好各种论坛社区找答案了。终于在github找到了我想要的。
在这里先贴上这个项目用到的依赖:
"dependencies": {"axios": "^0.17.1","babel-polyfill": "^6.26.0","element-ui": "^2.0.5","es6-promise": "^4.1.1","vue": "^2.5.2","vue-router": "^3.0.1","vuex": "^3.0.1"},
从github上面找到问题恰好出现在依赖包elementUI上,原因就出现在elementUI的依赖包里的es6语法没有被转成es5,而我项目中的babel-loader
只对src
和test
目录做了处理,
未修改前的webpack.base.conf.js
文件:
{test: /\.js$/,loader: 'babel-loader',include: [resolve('src'), resolve('test')]
},
现在把elementUI的依赖包也加入到babel-loader
的处理范围内,就解决上面的问题了。
修改后的webpack.base.conf.js
文件:本文重点在这里
{test: /\.js$/,loader: 'babel-loader',include: [resolve('src'), resolve('test'), resolve('/node_modules/element-ui/src'), resolve('/node_modules/element-ui/packages')]
},
改完之后,再次打包:
Build complete.Tip: built files are meant to be served over an HTTP server.Opening index.html over file:// won't work.
完美解决问题,放到测试环境一跑,ie9下也跑的很顺溜!
vue打包遇到的UglifyJs问题相关推荐
- vue 打包失败问题UglifyJs Unexpected token: name
注:适用于大多数 UglifyJs Unexpected token: name 的情况,犹如 element-ui.image-conversion.xlsx等插件. 问题背景: 最近在做一个 vu ...
- vue打包配置的详细说明【config/index.js的build部份】
一.vue打包配置的详细说明[config/index.js的build部份] index: path.resolve(__dirname, '../dist/index.html') 打包生成的文件 ...
- flask 渲染 vue 打包后的dist文件(直接用后端渲染)
flask 渲染 vue 打包后的dist文件(直接用后端渲染) vue项目打包出dist文件 npm run build 代码 from flask import Flask from flask ...
- vue 打包后访问接口报错404 解决方案 (前提是在vue里使用了代理)
vue 打包后访问接口报错404 解决方案 (前提是在vue里使用了代理) 参考文章: (1)vue 打包后访问接口报错404 解决方案 (前提是在vue里使用了代理) (2)https://www. ...
- vue打包后element-ui部分样式(图标)异常问题
vue打包后element-ui部分样式(图标)异常问题 参考文章: (1)vue打包后element-ui部分样式(图标)异常问题 (2)https://www.cnblogs.com/ljwsyt ...
- vue打包后element-icon不显示问题解决
在vue打包完,发现很多问题,来整理下: 第一:使用element框架的icon时候,开发环境下是没有问题的,打包完以后出现小方块,页面不显示, 解决办法:找到utils.js文件,加 publicP ...
- vue打包后css路径_Vue打包后访问静态资源路径问题
Vue打包后访问静态资源路径问题 Vue介绍中static文件夹里放的是静态资源目录,如图片.字体等. 我们发现运行npm run start后本地图片路径是没问题的,但是打包上传后会怎么样呢? 我们 ...
- vue打包后图片路径错误
2019独角兽企业重金招聘Python工程师标准>>> 错误原因 vue-cli中将图片资源路径放到了src的assets中,引入图片路径写的相对路径,打包发生错误 首先,出错点在u ...
- vue 打包路由报错_Vue下路由History模式打包后页面空白的解决方法
vue的路由在默认的hash模式下,默认打包一般不会有什么问题,不过hash模式由于url会带有一个#,不美观,而且在微信分享,授权登录等都会有一些坑.所以history模式也会有一些应用场景.新手往 ...
最新文章
- IntentService
- java Servlet Filter 拦截Ajax请求,统一处理session超时的问题
- MyEclipse配色字体等配置的解决方案
- android开发之播放音乐的方法
- latex入门到精通----IEEE模块为例
- neo4j 学习-2
- schema在oracle里是什么意思
- 怎样读取html控件(如文本框)的值
- 【十次方基础教程(后台)】Dockerfile脚本完成镜像的构建
- java万年历的两种实现方式
- Python画图显示中文
- sopcast在ubuntu上的安装与使用
- 前端播放m3u8格式视频
- Matlab用saveas函数自动编号保存图片
- Gauntlet风险评级上线: DeFi杠杆率多高?会不会崩盘?
- 实现socket监听所有网络命名空间
- SDWAN-虚拟网卡(最全详解)
- Linux 系统 CPU 占用率较高问题排查思路
- 2020-9-20 周报
- 推荐系统 | 威尔逊区间法
热门文章
- 怎样检测计算机硬件是否正常,怎么检查电脑硬件是否有問題
- 励志:“一床”录取通知书火了:看看这位同学的传奇
- 张效祥:祝贺YOCSEF成立十周年
- python timesleep单位_python的time.sleep()有多准确?
- 计算机毕业设计java课程设计程序设计SSM框架网上书城全套含微信支付
- python通达信股票分价表数据_通达信指标——分价图(主图)
- npm、yarn的安装和设置淘宝镜像源
- 守护地球家园,福泽各国人民,地球币,加油!#地球# 。 ​​​​
- C++ 明明想在学校中请一些同学一起做一项问卷调查,为了实验的客观性,他先用计算机生成了N个1到1000之间的随机整数(N≤1000),对于其中重复的数字,只保留一个,把其余相同的数去掉,不同的数对
- SOA部署:反常道而行之