在Vite项目中设置PrimeVue。
PrimeVue可以通过npm仓库下载使用。
# 使用npm
npm install primevue @primeuix/themes
# 使用yarn
yarn add primevue @primeuix/themes
# 使用pnpm
pnpm add primevue @primeuix/themes
必须将 PrimeVue 插件作为应用插件安装,以便设置默认的 配置。 该插件十分轻量,仅用于配置目的。
import { createApp } from 'vue';
import PrimeVue from 'primevue/config';
const app = createApp(App);
app.use(PrimeVue);
配置 PrimeVue 以使用类似于 Aura 的主题。
import { createApp } from 'vue';
import PrimeVue from 'primevue/config';
import Aura from '@primeuix/themes/aura';
const app = createApp(App);
app.use(PrimeVue, {
theme: {
preset: Aura
}
});
通过添加一个组件(例如 Button)来验证你的设置。 每个组件都可以单独导入和注册,这样你只需包含实际使用的部分,从而优化打包体积。 对应组件的文档中提供了导入路径。
import Button from "primevue/button"
const app = createApp(App);
app.component('Button', Button);
我们为 Vue 生态系统中的常用选项创建了各种示例。访问 primevue-examples 仓库以获取更多示例,包括 vite-quickstart 和 vite-ts-quickstart。
观看 Çağatay Çivici 的简短视频教程,学习如何使用 Create-Vue 以样式模式设置 PrimeVue。
欢迎来到 Prime UI 生态系统!当你成功运行 PrimeVue 后,我们推荐你探索以下资源,以便更深入地了解这个库。