在前端领域，我们经常需要使用图片来优化页面的视觉效果。除了使用 Photoshop 或 Sketch 等工具进行处理外，还有一种方法可以用代码直接生成 PRIMITIVE 形状的图片，这就需要使用到 node-primitive 这个 npm 包。
安装 node-primitive
在使用 node-primitive 之前，需要先安装它。可以使用 npm 命令行工具完成安装：
--- ------- -- --------------
使用 node-primitive
使用 node-primitive 非常简单，下面是它的使用指南。
命令行使用
在终端中输入以下命令：
--------- -- --------- -- ---------- -- ---
其中：
-i指定输入图片的路径（必选）-o指定输出图片的路径（必选）-n指定图形数量（必选）
在执行完这个命令后，就能生成一个包含 PRIMITIVE 形状的输出图片。
在项目中使用
当我们需要在项目中使用 node-primitive 时，需要先安装它：
--- ------- ------ --------------
然后在代码中引入它：
----- - -------- - - -------------------------- ----- --- - ----------------------------- ----------- ------ ---- --------- ---- ---------------- -- - ------------------------------ -------- ---
API 文档
Primitive(options)
生成 PRIMITIVE 形状的图片。
参数：
options.input要处理的图片的 Buffer。options.numSteps图形数量，建议 100-500 之间。options.knnKNN 算法，默认为false。options.alpha透明度，默认为128。options.repeat重复次数，默认为1。options.useBezier是否使用贝塞尔曲线，默认为false。options.onStep(step)单步回调函数。
返回值：
返回处理后的图片的 Buffer。
示例代码
下面是一个完整的使用 node-primitive 的示例代码：
----- - --------- - - -------------------------- ----- -- - -------------- ----- --- - ----------------------------- ----------- ------ ---- --------- ---- ---------------- -- - ------------------------------ -------- ---
总结
通过使用 node-primitive 这个 npm 包，我们可以用代码快速生成 PRIMITIVE 形状的图片，进而优化页面的视觉效果。希望本文能对大家有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60056b5681e8991b448e54f1