美文网首页
关闭sourcemap,create-react-app 打包速

关闭sourcemap,create-react-app 打包速

作者: mudssky | 来源:发表于2022-12-03 17:33 被阅读0次

我这边有一个项目用的是create-react-app比较老的版本,webpack4.x

一开始我只关注启动速度,启动是在是过于慢了,第一次启动要5分钟,打包其实也慢,慢的时候要3,4分钟。但是因为我一般不会在本地打包,而是代码合到测试环境就会自动构建了。所以对开发体验的影响倒不是很大。

先是优化了启动速度,从5分钟优化到有缓存的情况下1分钟启动。(因为webpack是单线程,速度其实和cpu单核性能有关,是我这台电脑i3-10100上的耗时)

如果能开多线程会更快一些,因为create-react-app不是很好配置,所以没有搞多线程。

  1. 主要是关闭了eslint检查,优化了2分钟
  2. 移除CaseSensitivePathsPlugin插件,优化了1分钟
  3. HardSourceWebpackPlugin 是一个缓存插件,有缓存的情况优化1分钟。

typescript检查就没必要关了,因为这个检查是多线程的,关了也只能优化10s左右,影响不大。

打包是我今天才突然发现的问题,因为新项目我换用vite打包了,vite依赖的node版本比较高,所以CI/CD流程需要调整,然后突然给我说打包的文件比之前少很多。

然后我一看,原来的项目打包大小都到40mb,很明显有很多sourcemap文件是不需要的。

到网上查了一下,有一个方法比较方便,就是配置.env文件就可以

在根目录下创建一个.env.production文件

加一句GENERATE_SOURCEMAP = false

这样js和css的sourcemap就都不会输出了。

这下我发现打包速度甚至40s左右,之前是2min30s。

相关文章

网友评论

      本文标题:关闭sourcemap,create-react-app 打包速

      本文链接:https://www.haomeiwen.com/subject/jmtmfdtx.html