【React】打包体积分析 source-map-explorer

通过分析打包体积,才能知道项目中的哪部分内容体积过大,方便知道哪些包需要进一步优化。

使用步骤

  1. 安装分析打包体积的包:npm i source-map-explorer
  2. 在 package.json 中的 scripts 标签中,添加分析打包体积的命令
  3. 对项目打包:npm run build(如果已经打过包,可省略这一步)
  4. 运行分析命令:npm run analyze
  5. 通过浏览器打开的页面,分析图表中的包体积
"scripts": {"analyze": "source-map-explorer 'build/static/js/*.js'",
}

27.png

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

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

相关文章

【C++】多线程(一):std::thread的使用

这篇文章应我朋友的邀请,写一篇文章介绍下C多线程。 编译环境准备 首先确定你的编译器支持std的thread,如果不支持,就会出现诸如“thread找不到”的问题。 以下假设你使用 gnu gcc 编译器,因为 MSVC 的我也不太熟悉。 linux …

Effective Modern C++(1.顶层const与底层const)

1.顶层const与底层const的定义 const修饰的变量不可以改变,那么他就是顶层const,如: const int a 10; 那么,对于 const int *const p new int(10); 第二个const就是顶层const,因为他修饰的是p;第一个…

学习.NET验证模块FluentValidation的基本用法(续3:ASP.NET Core中的调用方式)

FluentValidation模块支持在ASP.NET Core项目中进行手工或自动验证,主要验证方式包括以下三种:   1)手工注册验证类,并在控制器或其它模块中调用验证;   2)基于ASP.NET验证管道(validation …

Visual Studio 中文注释乱码解决方案

在公司多人开发项目中经常遇到拉到最新代码,发现中文注释都是乱码,很是emjoy..... 这是由于编码格式不匹配造成的,如果你的注释是 UTF-8 编码,而文件编码是 GBK 或者其他编码,那么就会出现乱码现象。一般的解决办法是…

打包SpringBoot 项目为本地应用

使用工具:exe4j、Inno Setup Compiler 步骤: 1,将dll包放入项目根路径下; 2,idea 使用Maven打jar包; 3,使用exe4j 工具进行打包; 打开工具首页不动(直接 next&#xff…

Shell脚本:Linux Shell脚本学习指南(第三部分Shell高级)三

十三、如何检测子Shell和子进程? 上节我们说了子 Shell 和子进程的区别,这节就来看一下如何检测它们。 我们都知道使用 $ 变量可以获取当前进程的 ID,我在父 Shell 和子 Shell 中都输出 $ 的值,只要它们不一样,不就是…

leetcode_828_统计子串中的唯一字符

题意:所有子串中单个字符出现的次数和 问题转化:对于串中的每个字符,只包含其一次的所有子串的个数和 关于求只包含某位置字符一次的子串个数 class Solution { public:int uniqueLetterString(string s) {/* ...A...A...A...*/int n s.size…

第二十二章 解读pycocotools的API,目标检测mAP的计算COCO的评价指标(工具)

Pycocotools介绍 为使用户更好地使用 COCO数据集, COCO 提供了各种 API。COCO是一个大型的图像数据集,用于目标检测、分割、人的关键点检测、素材分割和标题生成。这个包提供了Matlab、Python和luaapi,这些api有助于在COCO中加载、解析和可视化注释。 …

【Skynet 入门实战练习】实现网关服务 | 用户代理 | RPC 协议 | 客户端

文章目录 前言网关服务RPC 协议看门狗服务代理服务客户端逻辑梳理 前言 上两章学习了如何搭建一个项目,简单实现了几个基础模块。本章节会实现基本的客户端与服务端的通信,包括网关(gate)、看门狗(watchdog&#xff0…

springBoot常见的问题

文章目录 Spring Boot 中的监视器是什么?如何在 Spring Boot 中禁用 Actuator 端点安全性?我们如何监视所有 Spring Boot 微服务?如何集成 Spring Boot 和 ActiveMQ?什么是 Swagger?你用 Spring Boot 实现了它吗&#…

不适合当老师怎么转岗

作为一名老师,你需要耐心、热情、知识储备丰富,还要有一定的演讲技巧。但有时候,即使具备了这些条件,你仍然可能觉得自己的个性或能力并不适合这个职业。那么,该如何转岗呢?别担心,我们为你提供…

玉渊谭天对电影色彩分析的“蚊香图”复现-python

视频教程链接:https://www.bilibili.com/video/BV1Lu4y1t7FG/ 最终的实现效果如下: 前几天刷抖音刷到了玉渊谭天对于电影抽取画面制作“蚊香图”,相关视频片段如下。 这种制作”蚊香图“的特效当时有点触动到到我,根据色彩来分…

深度学习技巧应用30-深度学习中的GPU的基本架构原理与应用技巧

大家好,我是微学AI,今天给大家介绍一下深度学习技巧应用30-深度学习中的GPU的基本架构原理与应用技巧,GPU是一种专门用于处理大量并行操作的硬件设备,它的架构设计主要是为了图形渲染。然而,由于其并行处理能力,现在广泛应用于深度学习、科学计算等领域。主要的GPU制造商…

禁用WordPress前台搜索功能

WordPress自带的搜索功能很弱、效率非常低,如果有人利用这个缺陷发起很多搜索请求,你的服务器很有可能会宕机。我们可以使用百度、360等实现站内搜索,并禁止前台使用WordPress自带的搜索功能,在当前主题的 functions.php 文件里加…

Flutter学习(五)安装在gradle debug情况

前文回复 flutter环境配置 链接 背景 有了前文回顾,但是发现有部分的电脑,还是在下载环境的过程中,会卡在gradle builde的情况。所以有了该文章。 原因 配置了fullter的镜像,但是默认使用安卓的gradle变量,还是有…

autojs-练手-简单的视频号点赞(初阶版)

注释很详细,直接上代码(简单的练手实践,仅供参考) //设置点赞次数 var num50; //等待权限授予 auto.waitFor(); //进入点赞流程 while(num!0) {//先向下滑一个视频scrollDown();//使用auto.js找到点赞控件的id(每个人不…

《软件方法》2023版第1章:1.1 利润=需求-设计,1.2 ABCD工作流

DDD领域驱动设计批评文集 做强化自测题获得“软件方法建模师”称号 《软件方法》各章合集 第1章 建模和UML 牵着你走进傍晚的风里,看见万家灯火下面平凡的秘密。 《情歌唱晚》;词:黄群,曲:黄群,唱&#…

复数的几何意义

1、复平面,复数的其它表示法 (1)几何表示法 直角平面坐标: 复平面 实轴,虚轴 (2)向量表示法 向量 模: 复数加减法可用向量的三角形法则或者平行四边形法则 (3)结论 (两边之和大于第三边) ((两边之差大于第三边)) *辐角&am…

配置特定 IP 地址走指定网关

公司有两个日常上网用的路由器,分别接不同的两条网线,虽然都是电信的,但是一条偶尔会抽风,我的 VPS 会连不上,也就是挂在上面的 SS 无法使用。恰好这根线是公司接台式机的,也就是说平时上班偶尔会无法科学上…

【Web】/proc利用相关例题wp

先贴一篇文章一起学习一下 [CTF]proc目录的应用 - CodeAntenna ①[HDCTF 2023]YamiYami 点击Read somethings直接跳转到了百度 从url中发现存在任意文件读取,因为不知道flag在哪,所以考虑读环境变量 payload: ?urlfile:///proc/1/environ 拿到fla…