前端组件库

项目安装

npm install

编译和热启动开发环境

npm run serve

编译和压缩生产环境

npm run build

检查和修正代码格式

npm run lint

使用rollup构建库文件（默认，更小巧）

npm run lib

构建库文件并发布到npm

先执行lib命令，注意保证当前环境使用的是npm官方仓库源地址 https://registry.npmjs.org/

npm run pub

目录介绍

| build
--| config.js  # 构建配置
--| rollup.config.js  # 构建脚本
| examples  # 文档和示例
--| assets
--| components  # 示例中用到的组件
--| docs  # 文档目录
--|--| base # 基础组件文档
--| filters
--| md-loader # 实现markdown文件中的示例运行的脚本
--| router
--| views # 示例页面
--| App.vue
--| main.js
--| theme.json  # 图表库使用的主题配置文件
--| util.js
| images
| lib
| packages  # 基础组件目录
--| index.js  # 组件构建配置
| public
| styles

组件添加

1. 在 packages 目录下添加组件文件

• 组件结构、目录和文件命名严格参考以下要求，其他资源放到src目录下

| `<组件名>`
--| src # 组件的vue文件和其他相关资源目录
--|--| Main.vue # 组件的vue入口文件
--| index.js  # 组件入口文件，建议完全复制不作修改

Main.vue文件中 name 值为组件标签名，统一以 hd- 开头

export default {
  name: 'hd-block'
}

2. 在 build/config.js 中添加构建配置

  {
    name: 'hd-empty', # 仅作为构建文件名，与组件标签无关，但建议保持一致
    input: 'packages/empty/index.js',  // 构建输入文件
    output: 'lib/hd-empty.js' // 构建输出文件
  }

文档添加

1. 在 examples/docs/base 目录下添加组件文档文件

2. 在 examples/router/router.js 中添加构建配置

  {
    name: 'block',  # 文件名
    label: 'Block 块' # 左侧菜单显示的文字内容
  }

其中 name 与 docs 下 markdown 文件名必须完全一致