设计师常用的素材网站,河北住建局与建设厅网站,百度收录删除旧网站,wordpress 标签云链接文章目录 前言semi.design是什么#xff1f;怎么使用#xff1f;设计稿转代码后言 前言 hello world欢迎来到前端的新世界 #x1f61c;当前文章系列专栏#xff1a;前端系列文章 #x1f431;#x1f453;博主在前端领域还有很多知识和技术需要掌握#xff0c;正在不… 文章目录 前言semi.design是什么怎么使用设计稿转代码后言 前言 hello world欢迎来到前端的新世界 当前文章系列专栏前端系列文章 博主在前端领域还有很多知识和技术需要掌握正在不断努力填补技术短板。(如果出现错误感谢大家指出) 感谢大家支持您的观看就是作者创作的动力 semi.design是什么
semi.design官网 官网是这样说的 由抖音前端与 UED 团队维护易于定制的现代化设计系统帮助设计师与开发者打造高质量产品。 怎么使用
安装
# 使用 npm
npm i douyinfe/semi-ui# 使用 yarn
yarn add douyinfe/semi-ui# 使用 pnpm
pnpm add douyinfe/semi-ui在 Webpack、create-react-app 或 Vite 项目中使用时无需进行任何编译项配置直接使用即可。构建时所有相关资源均会按需打包。 直接使用
import { Button,Toast } from douyinfe/semi-ui;
const View (){return(div classNameaboutpButton onClick{() Toast.warning({ content: welcome })}Hello Semi/Button/p/div)
}
export default View设计稿转代码 Design to code简称D2C 是 Semi Design 提供的设计稿转代码功能支持一键识别 Figma 页面中图层布局 Semi 组件像素级还原设计稿转译为 JSX 和 CSS 代码快捷预览 无需从 0 开发。 从此你可以将 UI 还原的工作交给工具更专注于实现业务逻辑。 设计稿传代码
后言 创作不易要是本文章对广大读者有那么一点点帮助 不妨三连支持一下您的鼓励就是博主创作的动力