vue2项目编译webpack耗时统计
1. 手动统计耗时
vue编译命令npm run build
,其实际使用的命令是vue-cli-service build
,路径是node_modules\@vue\cli-service\lib\commands\build\index.js
- 原108行加入命令:
```javascript
const beginTime = Date.now()
```
![](https://img.haomeiwen.com/i13472962/cb4be2be74afedf7.png)
- 原209~210行之间加入代码:
```javascript
const endTime = Date.now()
info(`编译耗时:${chalk.cyan((endTime - beginTime) / 1000)}(s)`)
```
![](https://img.haomeiwen.com/i13472962/7e87c774e669f0bc.png)
-
npm run build
即可看出编译总耗时
3327643274-6059d0953d0a4_fix732.png
2. 使用第三方工具(推荐)
speed-measure-webpack-plugin每一项耗时都有精确统计,搭配使用webpack-bundle-analyzer打包后的各个模块文件大小,直观明了,根据具体项目再去进行优化。
网友评论