v0.1.9

快速开始

Apollo Design 是独立发展的 Vue 3 + TypeScript 原生组件库,以公开 API、真实使用场景和一致的设计语言演进,提供静态 CSS 与 CSS 变量主题方案。

环境要求

  • Vue 3.5+(Composition API)
  • TypeScript 5.x(推荐)
  • 现代浏览器(ES2022)

安装

npm install @apollo-design/ui @apollo-design/theme vue

图标按需安装 @apollo-design/icons。使用 AI 编程助手时,可参考 AI 接入 获取当前版本的 API 与示例。

引入

import { createApp } from 'vue';
import App from './App.vue';

// ① 设计令牌(零运行时 CSS 变量,必须最先引入)
import '@apollo-design/theme/tokens.css';
// ② 全量组件样式
import '@apollo-design/ui/style.css';

createApp(App).mount('#app');
<script setup lang="ts">
import { Button, Space } from '@apollo-design/ui';
</script>

<template>
  <Space>
    <Button type="primary">主按钮</Button>
    <Button>默认按钮</Button>
  </Space>
</template>

下一步

Powered by Vue 3 + ViteApollo Design · Vue NativeGitHub