使用webpack-bundle-analyzer分析uni-app 的微信小程序包大小(HbuilderX运行)

1、找到vue.config.js 文件。如果找不到,则在项目根目录下(跟pages.json同一个目录下)创建一个JS文件,命名为vue.config.js

2、安装webpack-bundle-analyzer,官方网站:https://github.com/webpack-contrib/webpack-bundle-analyzer。

(1)cd到项目根目录,运行命令行

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

3、配置vue.config.js文件,添加如下配置代码到文件,保存。

代码如下:【注意】:直接使用copy官网到代码运行HbuilderX 会报错,需要再加一层 configureWebpack

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;module.exports = {configureWebpack: { //直接使用copy官网到代码运行HbuilderX 会报错,在这里加了一层 //configureWebpackplugins: [new BundleAnalyzerPlugin()]}
}

4、HbuilderX 运行程序(运行——运行到小程序模拟器——微信开发者工具)

运行后,浏览器会自动打开一个网页,该网页就是webpack-bundle-analyzer的分析结果

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/106135.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

中国ui设计师年终工作总结

一、萌芽阶段 记得初次应聘时,我对公司的认识仅仅局限于行业之一,对UI设计师一职的认识也局限于从事相对单纯的界面的设计创意和美术执行工作。除此之外,便一无所知了。所以,试用期中如何去认识、了解并熟悉自己所从事的行业&…

Qt Designer UI设计布局小结

目录 前言1 居中布局2 左右布局3 上下布局4 复杂页面布局总结 前言 本文总结了在开发Qt应用程序时使用 Designer 进行UI布局的一些心得体会。Qt Designer是Qt提供的一个可视化界面设计工具,旨在帮助开发人员快速创建和布局用户界面。它提供了丰富的布局管理器和控件…

【深入解析spring cloud gateway】06 gateway源码简要分析

上一节做了一个很简单的示例,微服务通过注册到eureka上,然后网关通过服务发现访问到对应的微服务。本节将简单地对整个gateway请求转发过程做一个简单的分析。 一、核心流程 主要流程: Gateway Client向 Spring Cloud Gateway 发送请求请求…

C++在C语言基础上的优化

目录 一、命名空间 1、命名空间的定义 2、命名空间的使用 二、输入&输出 三、缺省参数 1、缺省参数的概念 2、缺省参数的分类 四、函数重载 五、引用 1.引用的概念 2.引用的特性 3、引用和指针的区别 六、内联函数 七、基于范围的for循环 一、命名空间 命名空…

Redis 集群环境案例安装步骤

1. 3主3从redis集群配置 1.1 找3台真实虚拟机,各自新建 mkdir -p /myredis/cluster 1.2 新建6个独立的redis实例服务 1.2.1 本次案例设计说明(ip有变化) https://processon.com/diagraming/5fe6d76ce401fd549c8fe708 1.2.2 IP: 192.168.111.175端门6381/端口6…

【JAVA-Day05】深入理解Java数据类型和取值范围

深入理解Java数据类型和取值范围 深入理解Java数据类型和取值范围摘要一、Java的数据类型1.1 存储单位1.2 Java基本数据类型 二、Java的取值范围2.1 变量定义2.2 取值范围验证 三、总结 博主 默语带您 Go to New World. ✍ 个人主页—— 默语 的博客👦🏻…

《Python深度学习-Keras》精华笔记3:解决深度学习多分类问题

公众号:机器学习杂货店作者:Peter编辑:Peter 持续更新《Python深度学习》一书的精华内容,仅作为学习笔记分享。 本文是第三篇:介绍如何使用Keras解决Python深度学习中的多分类问题。 多分类问题和二分类问题的区别注意…

Enterprise Architect15(EA) 工具栏,隐藏后显示快捷方式

没有工具栏 显示工具栏 快捷键:ctrl shift 3 或者Design-->点击ToolBox 工具栏中直接拖动即可创建对应的元素:

pyqt5设置背景图片

PyQt5设置背景图片 1、打开QTDesigner 创建一个UI&#xff0c;camera.ui。 2、创建一个pictures.qrc文件 在ui文件同级目录下先创建一个pictures.txt&#xff0c;填写内容&#xff1a; <RCC><qresource prefix"media"><file>1.jpg</file>…

网络通信深入解析:探索TCP/IP模型

http协议访问web 你知道在我们的网页浏览器的地址当中输入url&#xff0c;未必是如何呈现的吗&#xff1f; web浏览器根据地址栏中指定的url&#xff0c;从web服务器获取文件资源&#xff08;resource&#xff09;等信息&#xff0c;从而显示出web页面。web使用HTTP&#xff08…

SAM + YOLOv8 图像分割及对象检测

SAM(Segment Anything Model&#xff09;是由 Meta 的研究人员团队创建和训练的深度学习模型。该创新成果发表在 2023 年 4 月 5 日发表的一篇研究论文中&#xff0c;它立即引起了公众的广泛兴趣——相关的 Twitter 帖子迄今为止已累积超过 350 万次浏览&#xff1a; 计算机视…

云数据库知识学习——云数据库产品、云数据库系统架构

一、云数据库产品 1.1、云数据库厂商概述 云数据库供应商主要分为三类。 ① 传统的数据库厂商&#xff0c;如 Teradata、Oracle、IBM DB2 和 Microsoft SQL Server 等。 ② 涉足数据库市场的云供应商&#xff0c;如 Amazon、Google、Yahoo!、阿里、百度、腾讯…