在前端开发中，JavaScript 的体积一直是关注的重点之一。尤其在移动端，体积过大的 JavaScript 代码不仅影响用户体验，还会浪费用户的流量。因此，通过使用一些工具来控制 JavaScript 体积是非常必要的。
Size Limit Stream 是一个能够帮助我们控制 JavaScript 体积的工具，并已经被发布为 npm 包。本文将介绍该工具的使用方法，帮助你更好地控制前端代码的体积。
安装 size-limit-stream
使用 npm 进行安装：
npm install size-limit-stream
使用 size-limit-stream
下面介绍一下 size-limit-stream 实现 JavaScript 体积控制的基本用法。
添加配置文件
在项目根目录下新建一个 .sizelimit 的文件，该文件用于配置 size-limit-stream 的一些参数。具体如下：
[
{
"name": "main.js",
"stream": "fs.createReadStream('dist/main.js')",
"limit": "150 KB"
}
]name：文件名，用于标识哪个文件需要进行体积控制；stream：读取该文件的 ReadStream；limit：体积的限制，支持的单位有 B、KB、MB、GB 和 TB。
运行 size-limit-stream
在终端执行以下命令：
size-limit .sizelimit
这条命令将会读取 .sizelimit 文件，并根据其中的配置限制 JavaScript 体积。
确认是否限制成功
如果 JavaScript 体积超过了设定的限制，则 size-limit-stream 会在终端中输出警告，并自动退出程序。
如果 JavaScript 体积在限制内，则 size-limit-stream 不会显示任何内容。这种情况下，你可以通过在终端中输入以下命令来查看具体体积大小：
size-limit .sizelimit --why
该命令将显示 JavaScript 文件的具体体积大小，以及与限制的大小之间的差值。
将 size-limit-stream 集成到构建过程中
你可以将 size-limit-stream 集成到你的项目中，在构建过程中使用它来限制 JavaScript 体积。
例如，通过 webpack 打包应用的时候，可以使用 size-plugin 去检查库的体积是否超过了限制。
-- -------------------- ---- -------
--- ---------- - -----------------------
-------------- - -
------ -------------
------- -
--------- -----------
--
-------- -
--- ------------
-
--结语
通过使用 size-limit-stream，我们可以方便地控制 JavaScript 体积，从而提升用户体验和减少流量的浪费。我们建议在每次代码提交时都运行 size-limit-stream 来确保体积在限制内。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/the-size-limit-stream