包体积分析

包体积分析

通过 可视化 的方式,直观的体现项目中各种包打包之后的体积大小,方便做优化

实现步骤

  1. 安装包 source-map-explorer
1
pnpm i source-map-explorer
  1. 打包项目时需要开启 build-source-map

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    //vite.config.js
    {
    build:{
    sourcemap:true,
    }
    }

    //webpack.config.js
    {
    devtool:"source-map"
    }

  2. 配置命令指定要分析的 js 文件

1
2
3
4
5
{
"scripts": {
"analyze": "source-map-explorer 'dist/assets/*.js'"
}
}
  1. 执行命令


包体积分析
http://blog.climbed.online/2023/11/24/Web -- Knowledge is infinite/前端/构建相关/包体积分析/
作者
Z.K.
发布于
2023年11月24日
许可协议