CQ Design UI

一个基于 Vue 2.0 的组件库，参考 Element UI 的设计和架构。

特性

• 基于 Vue 2.0 开发
• 支持按需引入
• 灵活的主题定制
• 丰富的组件库

安装

npm install cq-design-ui

快速开始

完整引入

import Vue from 'vue';
import CqDesignUI from 'cq-design-ui';
import 'cq-design-ui/lib/theme.css';

Vue.use(CqDesignUI);

按需引入

import Vue from 'vue';
import { Button, Input, MetricCard } from 'cq-design-ui';
import 'cq-design-ui/lib/theme.css';

Vue.component(Button.name, Button);
Vue.component(Input.name, Input);
Vue.component(MetricCard.name, MetricCard);

组件列表

• MetricCard: 指标卡片组件
• Button: 按钮组件
• Input: 输入框组件

主题定制

可以通过修改 SCSS 变量来定制主题：

// custom-theme.scss
$color-primary: #409eff;

@import "~cq-design-ui/packages/theme-chalk/src/index.scss";

然后在项目中引入自定义主题文件：

import './custom-theme.scss';

License

MIT