什么是 shapecss
shapecss 是一个可以帮助开发者快速创建各种形状的 npm 包。它提供了简单易用的 API，可以让我们创建各种常见的图形以及自定义的图形。
安装 shapecss
在开始使用 shapecss 之前，我们需要先安装它。打开终端，执行以下命令即可完成安装：
npm install shapecss
使用 shapecss
接下来，我们将演示如何使用 shapecss 创建一个矩形。
首先，在 HTML 文件中引入 shapecss：
-- -------------------- ---- -------
--------- -----
------
------
---
------- ------------------------------------------
-------
------
---
-------
-------然后，在 JavaScript 文件中创建并配置一个矩形对象：
const rect = Shapes.rectangle({
width: 200,
height: 100,
fill: '#f00'
})这段代码创建了一个宽为 200，高为 100 的红色矩形。现在，我们需要将它添加到页面中：
Shapes.add(rect)
这样就完成了一个简单的矩形的创建与添加。
API 文档
下面是一些常用的 API，更详细的 API 文档可以在 shapecss 官方文档中找到。
rectangle(options)
创建一个矩形对象。
options.width矩形宽度options.height矩形高度options.fill矩形填充颜色
circle(options)
创建一个圆形对象。
options.radius圆形半径options.fill圆形填充颜色
triangle(options)
创建一个三角形对象。
options.width三角形底边宽度options.height三角形高度options.fill三角形填充颜色
add(shape)
将一个形状对象添加到页面中。
shape形状对象
clear()
清空页面中所有形状。
总结
本文详细介绍了如何使用 shapecss 这一 npm 包创建简单的图形。除了上述介绍的常用 API 之外，shapecss 还提供了更多有趣的创建图形的 API，可以让开发者更加灵活地创建各种形状。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055a0781e8991b448d7aeb