LX Figma UI

Vue 3 组件库，�?Figma 设计生成�?

安装

npm install lx-figma-ui

使用

全局引入

import { createApp } from 'vue'
import FigmaUI from 'lx-figma-ui'
import 'lx-figma-ui/style.css'

const app = createApp(App)
app.use(FigmaUI)
app.mount('#app')

按需引入

import { Button } from 'lx-figma-ui'
import 'lx-figma-ui/style.css'

// 在组件中使用
export default {
  components: {
    Button
  }
}

组件

Button

Props:

| 属�?| 类型 | 默认�?| 说明 | |------|------|--------|------| | type | 'primary' \| 'outline' \| 'text' \| 'danger' | 'primary' | 按钮类型 | | size | 'small' \| 'medium' \| 'large' | 'medium' | 按钮尺寸 | | state | 'default' \| 'disabled' \| 'loading' | 'default' | 按钮状�?| | disabled | boolean | false | 是否禁用 | | block | boolean | false | 是否块级元素 | | className | string | '' | 自定义类�?|

Events:

• click: 点击事件

示例:

<Button type="primary" size="large">主要按钮</Button>
<Button type="outline" state="disabled">禁用按钮</Button>
<Button type="danger" @click="handleClick">危险按钮</Button>

发布�?npm

# 1. 登录 npm
npm login

# 2. 构建
npm run build

# 3. 发布
npm publish