2.10.3 • Published 6 years ago

cap-ui v2.10.3

Weekly downloads
3
License
MIT
Repository
github
Last release
6 years ago

Capsule(胶囊),简称Cap,是一款基于饿了么 饿了么版本2.10.1开发的PC UI组件库。

项目文件结构

build 放置webpack的配置文件

lib打包生成文件

examples 放说明文档页面的文件 (修改文档或编写新组件的文档都在这里)

packages 放置ui组件

packages/src/theme-chalk 所有css样式放置在这个目录下,其中common/var.scss 为css变量文件

src/index.js组件注册的入口文件 ,配置webpack自动生成的,若需要修改请修改模板 /Users/yupeiying/Desktop/element/build/bin/entry-template.js

src/directives放置自定义指令

src/locale放置语言的配置文件

src/mixins放置组件用的混合文件

src/transitions放置动画配置文件

src/utils放置用到工具函数文件

test 测试文件

types typeScript文件

快速开发新组件

  • step1: npm run new newComponentName 自动生成开发组件所需的文件,找到相应文件编写代码即可

例如npm run new testComp 会生成以下文件:

  1. examples/doc/ 下生成4个testComp.md文件

  2. packages下生成testComp文件夹

  3. packages/src/theme-chalk/src 下生成 testComp.scss 文件

  4. test 和 types 下也会生成相应的文件

  • step2: npm run dist 打包所有的组件到lib文件夹下

安装Install

npm install cap-ui -S

使用Quick Start

import Vue from 'vue'
import Element from 'cap-ui'

Vue.use(Element)

// or
import {
  Select,
  Button
  // ...
} from 'cap-ui'

Vue.component(Select.name, Select)
Vue.component(Button.name, Button)