Bundle Visualizer

bundle-visualizer 包是一个分析工具，它在 Web 浏览器中提供了一个可视化表示，显示了初始客户端包中包含的内容。初始客户端包是浏览器下载并执行以运行 Meteor 应用程序的主要代码包，其中包含通过 meteor add <package> 添加的包或 node_modules 目录中包含的 Node 模块，并在应用程序中使用。

此可视化可以揭示有关哪些文件或包占用初始客户端包中空间的详细信息。这对于确定哪些导入可能是转换为动态 import() 语句（这些语句被排除在初始客户端包之外）的候选对象，或者用于识别无意中包含在项目中的包很有用。

工作原理

此包利用 <hash>.stats.json 文件，这些文件在使用 --production 标志运行应用程序时与文件包一起写入。最小化文件大小的具体详细信息由最小化程序包添加，因此务必查看以下最小化程序要求。

要求

此包需要项目最小化程序提供的数据。因此，有必要使用官方的 standard-minifier-js 包或包含在最小化过程中获得的文件大小详细信息的最小化程序。

用法

由于包分析仅在最小化包上真正准确，并且最小化不会在开发期间进行（因为它是一个复杂且 CPU 密集型过程，会大大减慢正常的开发速度），因此此包必须与 --production 标志结合使用到 meteor 工具以模拟生产捆绑并启用最小化。

**重要提示：**由于此包在生产模式下处于活动状态，因此务必仅暂时添加此包。这可以通过使用 --extra-packages 选项轻松实现到 meteor。

启用

$ cd app/
$ meteor --extra-packages bundle-visualizer --production

查看

启用后，像往常一样在 Web 浏览器中查看应用程序（例如 https://127.0.0.1:3000/），图表将显示在应用程序顶部。

禁用

如果使用的是 --extra-packages，只需从包含的包列表中删除 bundle-visualizer 并像往常一样运行 meteor。

如果您已使用 meteor add 永久添加了 bundle-visualizer，则在使用 meteor remove bundle-visualizer 捆绑或部署到生产环境之前，务必删除此包。