个人随意编写的组件库——Casual UI，支持 Vue3+、React17+、Svelte3+

Github

GitHub - Casual-UI/casual-ui: An ui components lib that supports React17+, Vue3+ and Svelte3+ An ui components lib that supports React17+, Vue3+ and Svelte3+ - GitHub - Casual-UI/casual-ui: An ui components lib that supports React17+, Vue3+ and Svelte3+ GitHub - github.com

在线示例 & 文档

• React 文档
• Vue 文档
• Svelte 文档（目前仅英文）

安装 & 使用

Vue3 用户

• 安装依赖

npm install @casual-ui/vue

• 全局使用

import { createApp } from 'vue'
import CasualUI from '@casual-ui/vue'
import '@casual-ui/vue/dstyle.css'

const app = createApp()
app.use(CasualUI)
app.mount('#app')

• 局部使用

<script setup>
import { CButton } from '@casual-ui/vue'
</script>
<template>
  <c-button label="一个按钮" />
</template>

React17+ 用户

• 安装依赖

npm install @casual-ui/react

• 入口文件导入样式

import '@casual-ui/react/dist/style.css'

• 使用

import { CButton } from '@casual-ui/react'

function SomeComponent() {

  return <CButton label="一个按钮" />
}

Svelte3+ 用户

• 安装依赖

npm install @casual-ui/svelte

• 入口文件导入样式

import '@casual-ui/svelte/dist/style.css'

• .svelte 文件中使用

<script>
  import { CButton } from '@casual-ui/svelte'
</script>
<CButton label="一个按钮" />

参与贡献

贡献指南

鸣谢

Vue
Vite
Sass
PNPM
React
ESLint
Quasar
Stylelint
Vuepress v2
Vue Styleguidist
Docusaurus
VSCode
Svelte
Svelte Kit

协议

MIT