
NaivePlus
一个基于 Vue3 和 NaiveUI 的组件库
快速开发
坚实贯彻配置驱动视图的思想,落实万物皆可 option。
极简代码
坚决贯彻极简封装和最少代码原则,让枯燥的crud在几秒内即可完成。
最佳实践
提供最佳实践代码,让每一位开发者都能以正确的姿势来使用 carton ui。
一、快速入门
1. 安装 naive-ui
naive-plus基于 naiveUI 封装
npm i naive-ui -D
2. 安装 naive-plus
npm i naive-plus -D
3. 安装 unplugin
通过 unplugin-vue-components 和 unplugin-auto-import 来实现按需引入和自动导入
npm install -D unplugin-vue-components unplugin-auto-import
4. 按需引入
import AutoImport from 'unplugin-auto-import/vite';
import Components from 'unplugin-vue-components/vite';
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers'
import { NaivePlusResolver } from 'naive-plus/lib/resolver'
export default {
plugins: [
// ...
AutoImport({
imports: ['vue'],
}),
Components({
resolvers: [
// 添加按需引入
NaiveUiResolver(),
NaivePlusResolver(),
],
}),
],
};
5. 使用
<np-button>按钮</np-button>