快速开始

本节将介绍如何在项目中使用组件库。

安装

前置准备

本组件库基于element-plus开发，因此要求您本地环境需满足以下条件：

• Vue 3.4及以上版本。
• Element-plus 2.8及以上版本
• Lodash 4.17.21及以上版本
• Node.js 18 及以上版本。

依赖安装

pnpm

$ pnpm add @ovyvo/radiant-ui@latest

npm

$ npm add @ovyvo/radiant-ui@latest

yarn

$ yarn add @ovyvo/radiant-ui@latest

项目使用

组件支持两种使用方式，全量引入及手动按需引入。

WARNING

注意：因组件库基于Element-plus开发，请在使用之前务必保证正确引入element-plus样式文件,保证组件样式正常

// main.ts
import "element-plus/dist/index.css"

全量引入

// main.ts
import { createApp } from "vue"
import App from "./App.vue"

import RadiantUI from "@ovyvo/radiant-ui"
import "element-plus/dist/index.css"
import "@ovyvo/radiant-ui/index.css"

const app = createApp(App)

app.use(RadiantUI) 
app.mount("#app")

按需引入

<template>
  <ra-actbtn></ra-actbtn>
</template>
<script setup>
import { RaActbtn } from "@ovyvo/radiant-ui"
import "@ovyvo/radiant-ui/theme-chalk/src/ra-actbtn.css"
</script>