浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】


Posted in Javascript onOctober 23, 2019

为优化vue项目性能,需要使用webpack-bundle-analyzer分析报文件,找出最占用空间的插件有哪些,对应做出优化

网上看了一些网站,有的写的太麻烦了,现将最简单的一种写出来供大家参考

安装:

npm install webpack-bundle-analyzer --save-dev

vue.config.js配置

module.exports = {
 chainWebpack: config => {
  config
   .plugin('webpack-bundle-analyzer')
   .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
 }
}

运行命令

npm run serve

访问 http://localhost:8888

  注意8888端口是写死的,不可以更改,如果本地已经启动了8888端口,会报错

页面展示

浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】

总结

以上所述是小编给大家介绍的vue-cli3配置webpack-bundle-analyzer插件,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
jQuery lazyload 的重复加载错误以及修复方法
Nov 19 Javascript
javascript smipleChart 简单图标类
Jan 12 Javascript
15个款优秀的 jQuery 图片特效插件推荐
Nov 21 Javascript
自己使用jquery写的一个无缝滚动的插件
Apr 30 Javascript
Jquery修改页面标题title其它JS失效的解决方法
Oct 31 Javascript
jquery ajax双击div可直接修改div中的内容
Mar 04 Javascript
javascript面向对象程序设计高级特性经典教程(值得收藏)
May 19 Javascript
使用ngrok+express解决本地环境中微信接口调试问题
Feb 26 Javascript
深入浅出理解JavaScript高级定时器原理与用法
Aug 02 Javascript
vue-router 前端路由之路由传值的方式详解
Apr 30 Javascript
Bootstrap实现模态框效果
Sep 30 Javascript
Javascript webpack动态import
Apr 19 Javascript
p5.js临摹动态图形实现方法详解
Oct 23 #Javascript
jQuery实现轮播图源码
Oct 23 #jQuery
JavaScript实现图片轮播特效
Oct 23 #Javascript
jQuery实现图片随机切换、抽奖功能(实例代码)
Oct 23 #jQuery
微信小程序实现多行文字超出部分省略号显示功能
Oct 23 #Javascript
Vue实现数据请求拦截
Oct 23 #Javascript
Vue项目中如何使用Axios封装http请求详解
Oct 23 #Javascript
You might like
javascript 小型动画组件与实现代码
2010/06/02 PHP
分享一个php 的异常处理程序
2014/06/22 PHP
php实现utf-8转unicode函数分享
2015/01/06 PHP
通过修改配置真正解决php文件上传大小限制问题(nginx+php)
2015/09/23 PHP
PHP实现爬虫爬取图片代码实例
2021/03/03 PHP
PHP7 新增功能
2021/03/09 PHP
Mootools 1.2教程 定时器和哈希简介
2009/09/15 Javascript
IE之动态添加DOM节点触发window.resize事件
2010/07/27 Javascript
新浪微博字数统计 textarea字数统计实现代码
2011/08/28 Javascript
jQuery Tools tab使用介绍
2012/07/14 Javascript
jQuery实现当前页面标签高亮显示的方法
2015/03/10 Javascript
js实现点击切换TAB标签实例
2015/08/21 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
2015/11/18 Javascript
jQuery焦点图轮播插件KinSlideshow用法分析
2016/06/08 Javascript
原生JS实现匀速图片轮播动画
2016/10/18 Javascript
详解nodejs爬虫程序解决gbk等中文编码问题
2017/04/06 NodeJs
关于vue中的ajax请求和axios包问题
2018/04/19 Javascript
微信小程序实现漂亮的弹窗效果
2020/05/26 Javascript
详解VUE调用本地json的使用方法
2019/05/15 Javascript
关于你不想知道的所有Python3 unicode特性
2014/11/28 Python
Python连接mssql数据库编码问题解决方法
2015/01/01 Python
python遍历一个目录,输出所有的文件名的实例
2018/04/23 Python
python中字符串内置函数的用法总结
2018/09/13 Python
python爬虫之urllib,伪装,超时设置,异常处理的方法
2018/12/19 Python
python解包概念及实例
2021/02/17 Python
英国床和浴室商场:Bed & Bath Emporium
2018/05/20 全球购物
调解员先进事迹材料
2014/02/07 职场文书
11月升旗仪式讲话稿
2014/02/15 职场文书
一年级班主任感言
2014/03/08 职场文书
关于保护环境的标语
2014/06/09 职场文书
简单租房协议书范本
2014/08/20 职场文书
舞蹈社团活动总结
2015/05/07 职场文书
2016消防宣传标语口号
2015/12/26 职场文书
Nginx反向代理多个服务器的实现方法
2021/03/31 Servers
AJAX实现省市县三级联动效果
2021/10/16 Javascript
zabbix配置nginx监控的实现
2022/05/25 Servers