ease-element

基于element-ui组件库, 快速搭建中后台系统

npm包

地址

安装

1、定义命令别名"nenpm":

alias nenpm='cnpm --registry=http://rnpm.hz.netease.com/ --registryweb=http://npm.hz.netease.com/ --cache=$HOME/.nenpm/.cache --userconfig=$HOME/.nenpmrc'

2、安装

nenpm install @ehr/ease-element

按需引入

1、安装 babel-plugin-component：

yarn add  babel-plugin-component -D 

# or  npm i babel-plugin-component -D 

2、在.babelrc 加入

[
      'component',
      {
        libraryName: '@ehr/ease-element',
        style: false
      },
      '@ehr/ease-element'
    ]

# or 方便本地调试的配置

const isProduction = process.env.NODE_ENV === 'production' && process.env.VUE_APP_MODE === 'production'
[
      'component',
      {
        libraryName: '@ehr/ease-element',
        style: false
        libDir: isProduction ? 'lib' : 'src/packages'
      },
      '@ehr/ease-element'
]

# or npm run watch 

创建新组件

通过命令创建骨架

npm run new:components 组件名(小写+中划线连接，例 npm run new:components ease-text)

会在6个地方做初始化创建，允许命令行之后正常显示如下

------2、src/lib创建组件成功---------
------4、docs/.vuepress组件创建成功---------
------5、docs/views/components组件文档创建成功---------
------done~～快去完善组件吧～～----------------

组件文档

npm run docs:dev

目录

|-- ease-element
    |-- .babelrc                           // babel相关配置
    |-- .eslintrc                          // eslint相关配置
    |-- .gitignore
    |-- README.md                          // 项目说明文档
    |-- components.json                    // 组件配置文件
    |-- package.json
    |-- yarn.lock
    |-- build                              // 打包
    |   |-- bin
    |   |-- webpack                   
    |-- docs                               // 文档
    |-- src                                // 入口文件以及各种辅助文件
    |   |-- components                     // 组件源码
    |   |-- directive                      // 指令
    |   |-- mixins
    |   |-- style                          // 全局样式

指令介绍

2. npm run docs:dev 组件文档开发环境
3. npm run docs:build 组件文档打包
4. npm run new:components 快速初始化组件骨架
5. npm run lib 组件库打包
6. npm run utils src/util 打包
7. npm run watch 监听变化，方便本地调试
8. npm run verbose 查看打包时具体报错信息

整体计划

组件

utils

脚手架