0.1.3-beta.2 • Published 9 months ago

c-design-ui v0.1.3-beta.2

Weekly downloads
-
License
MIT
Repository
-
Last release
9 months ago

c-design-vue

基于 ant design vue 二次封装的前端组件库

项目结构

├── docs                                    /* 组件库文档 */
│   .vuepress                               /* vuepress 配置 */
│   ├── enhanceApp.js         				/* 注册全局组件 */
│   ├── config.js                         	/* vuepress配置文件 */
│   README.md                               /* 文档 home 页 */
└── examples                              	/* 组件案例 */
│   ├── ...
└── packages                              	/* 组件源码包 */
│   ├── Button                             	/* Button 组件 */
│   │   ├── src                           	/* vue组件 */
│   │   ├── index.js             			/* 组件配置文件 */
│   │   ├── README.md                     	/* 组件说明文档 */
│   ├── From                               	/* 表单组件 */
│   ├── Table                              	/* 表格组件 */
├── templates                             	/* plop 配置clone的模板文件夹 */
├── tests                             		/* 单元测试 */
├── .eslintrc.js                            /* eslint 配置 */
├── .gitignore                             	/* gitignore 配置 */
├── .prettierrc                            	/* prettier 配置 */
├── .stylelintrc          					/* stylelint 配置 */
├── babel.config.js                      	/* babel 配置 */
├── jest.config.js                        	/* jest 配置 */
├── LICENSE                             	/* license */
├── package.json                       		/* package.json */
├── plopfile.js                            	/* plop 配置 */
├── vue.config.js                           /* vue cli 配置 */
└── README.md                      			/* 文档说明文件 */

快速开始

npm install

组件文档

运行文档

npm run docs:dev

打包文档

npm run docs:build

开发组件

创建组件

快速生成组件模板文件

组件文件采用大驼峰式命名法,首字母大写。如:Table、TimePicker

npm run create:comps

执行npm run create:comps后,根据步骤会执行根目录下plopfile.js文件中的脚本命令,执行以下步骤:

  • package文件中创建自定义命名的组件目录
  • package/index.js自动注册组件
  • docs/components目录下创建组件同名的.md文档文件

提交代码

提交代码到git仓库,使用git cz代替git commit

// 全局安装
npm install -g commitizen

// 1. 暂存记录
git add .  // 或者使用编辑器(如:VSCode)图形化操作界面

// 2. 按提示录入提交信息
git cz

// 3. 上传代码
git push

组件打包

npm run lib

案例

预览案例

npm run serve

打包案例

npm run build