快速开始

uniapp 项目

// main.ts
import { createSSRApp } from 'vue'
import App from './App.vue'
import SkylerUI from '@whskyler/skyler-ui'

export function createApp() {
  const app = createSSRApp(App)
  app.use(SkylerUI)
  return { app }
}

<!-- App.vue -->
<style lang="scss">
@use '@whskyler/skyler-ui/scss';
</style>

之后在任意页面使用：

<template>
  <view style="padding: 32rpx">
    <sky-button type="primary" @click="hello">点我</sky-button>
    <sky-divider>or</sky-divider>
    <sky-tag type="success">在线</sky-tag>
  </view>
</template>

<script setup lang="ts">
const hello = () => uni.showToast({ title: 'Hello Skyler UI' })
</script>

组件命名

所有组件统一以 Sky 作为大驼峰前缀，标签名以 sky- 作为短横线前缀：

组件	标签
SkyButton	<sky-button>
SkyTag	<sky-tag>
SkyCell	<sky-cell>
SkyIcon	<sky-icon>
SkyDivider	<sky-divider>
SkyLoading	<sky-loading>
SkyToast	<sky-toast>

TypeScript

所有 Props / Emits / Slot 都有完整类型，IDE（VS Code、WebStorm）会自动给出提示。Volar 用户无需额外配置。