znellaicon 中文文档教程
使用 Figma 的图标自动化工作流程
这是 Figma 图标自动化插件 的存储库。
开发
在根目录下创建一个.env。将您的 Figma 文件 url 和 Figma 令牌放入其中。
FIGMA_FILE_URL=https://www.figma.com/file/********************/juuust-react-icon
FIGMA_TOKEN=********************************
获取 SVG 文件
运行 yarn fetch 从 Figma 文件中获取 SVG 文件。这会将您的 SVG 拉入 ./src/svg/ 中。
为图标生成 React 组件
运行yarngenerate从SVG文件生成组件文件。这会将您的组件文件拉入 ./src/icons/ 中。
在本地
开发运行yarn dev来开发可以看到所有图标的应用程序。
在本地
进行开发运行yarn build来构建页面。
Icon Automation Workflow Using Figma
It's a repository for Figma Icon Automation Plugin.
Development
Create a .env in the root directory. Put your Figma file url and Figma token inside.
FIGMA_FILE_URL=https://www.figma.com/file/********************/juuust-react-icon
FIGMA_TOKEN=********************************
fetch SVG file
Run yarn fetch to fetch SVG files from Figma file. This will pull your SVGs in ./src/svg/.
generate React components for icons
Run yarn generate to generate component files from SVG files. This will pull your component files in ./src/icons/.
Develop in local
Run yarn dev to develop the application in which you can see all icons.
Develop in local
Run yarn build to build Pages.
