当前位置: 首页 > news >正文

打包体积分析和优化

webpack分析工具:webpack-bundle-analyzer

1. 通过<script src="./vue.js"></script>方式引入vue、vuex、vue-router等包(CDN)

// webpack.config.js
if(process.env.NODE_ENV==='production') {module.exports = {devtool: 'none',externals: {vue: 'Vue',vuex: 'Vuex',vue-router: 'VueRouter'}}
}

2. core-js-----babel的一些降级处理(针对ES6的降级处理)(兼容低版本浏览器)

// "build": "vue-cli-service build --modern" // build时加上--modern后会进行两次打包
// 打包出来的html:
// 针对高版本的浏览器(加载的打包体积小)
<script type="module" src="/js/chunk-verder.xxsfds"></script>
// 针对低版本的浏览器才会加载这个
<script scr="/js/chunk-vender.skk113" nomodule></script>

相关文章:

  • JDK动态代理
  • SolidityFoundry 安全审计测试 Delegatecall漏洞2
  • 【Unity服务器01】之【AssetBundle上传加载u3d模型】
  • 前端 三维空间笔记
  • Java中的NIO编程实践精华
  • 程序的“通用性”和“过度设计”困境
  • zookeeper学习、配置文件参数详解
  • SSM旅游系统
  • WDF驱动开发-WDF总线枚举(一)
  • obsidian中用check list 打造待办清单
  • 在阿里云使用Docker部署MySQL服务,并且通过IDEA进行连接
  • 软件介绍—Fluent Reader (RSS阅读器)
  • SparkSQL的分布式执行引擎-Thrift服务:学习总结(第七天)
  • Java学习 - 网络TCP,UDP协议讲解
  • 基于uni-app和图鸟UI开发上门服务小程序
  • 【跃迁之路】【444天】程序员高效学习方法论探索系列(实验阶段201-2018.04.25)...
  • JS函数式编程 数组部分风格 ES6版
  • js学习笔记
  • PV统计优化设计
  • Terraform入门 - 1. 安装Terraform
  • vagrant 添加本地 box 安装 laravel homestead
  • vue自定义指令实现v-tap插件
  • 从零开始的无人驾驶 1
  • 第十八天-企业应用架构模式-基本模式
  • 对象引论
  • 关于Android中设置闹钟的相对比较完善的解决方案
  • 入职第二天:使用koa搭建node server是种怎样的体验
  • 微服务核心架构梳理
  • Prometheus VS InfluxDB
  • #DBA杂记1
  • #Linux杂记--将Python3的源码编译为.so文件方法与Linux环境下的交叉编译方法
  • #我与Java虚拟机的故事#连载03:面试过的百度,滴滴,快手都问了这些问题
  • (2.2w字)前端单元测试之Jest详解篇
  • (30)数组元素和与数字和的绝对差
  • (6)添加vue-cookie
  • (PWM呼吸灯)合泰开发板HT66F2390-----点灯大师
  • (SpringBoot)第七章:SpringBoot日志文件
  • (层次遍历)104. 二叉树的最大深度
  • (二)Pytorch快速搭建神经网络模型实现气温预测回归(代码+详细注解)
  • (考研湖科大教书匠计算机网络)第一章概述-第五节1:计算机网络体系结构之分层思想和举例
  • (转) RFS+AutoItLibrary测试web对话框
  • (转)树状数组
  • (转载)CentOS查看系统信息|CentOS查看命令
  • .NET CF命令行调试器MDbg入门(三) 进程控制
  • .NET成年了,然后呢?
  • /proc/vmstat 详解
  • /使用匿名内部类来复写Handler当中的handlerMessage()方法
  • @require_PUTNameError: name ‘require_PUT‘ is not defined 解决方法
  • [240607] Jina AI 发布多模态嵌入模型 | PHP 曝新漏洞 | TypeScript 5.5 RC 发布公告
  • [AIGC] CompletableFuture的重要方法有哪些?
  • [Angular 基础] - 指令(directives)
  • [BZOJ] 2006: [NOI2010]超级钢琴
  • [C++核心编程](四):类和对象——封装
  • [dfs] 图案计数
  • [flutter]一键将YAPI生成的api.json文件转为需要的Dart Model类的脚本