# lfbp-Element(Extend from element)

## Links
- [Element Git repo](https://github.com/ElemeFE/element.git)
- [Element Home Page](http://element.eleme.io/)


## 开发环境搭建
首先你需要 Node.js 4+ (推荐6.9.5版本)和 NPM 3+
```shell
git clone git@github.com:ElemeFE/element.git
npm run dev

# open http://localhost:8085
```

如果国内用户觉得安装慢可以使用 [yarn](https://github.com/yarnpkg/yarn) 搭配 taobao registry
```shell
npm i yarn -g
yarn config set registry https://registry.npm.taobao.org
yarn
npm run dev

# open http://localhost:8085
```

To build:

```shell
npm run dist
```

## 组件开发规范
- 通过 `make new` 创建组件目录结构，包含测试代码、入口文件、cooking 配置、package.json、文档
- 如果包含父子组件，需要更改目录结构，参考 `Button`
- 组件内如果依赖了其他组件，需要在当前组件内引入，参考 `Select`
> Ifbp 组件开发

#### 添加组件

1. 在ifbp-element项目根目录下packages文件里创建文件夹，例如：
```shell
mkdir test
```
2. 在该组件文件目录下index.js里暴露组件出去，这里的命名规则要保持与lfbp-element保持一致，以El作为组件前缀，例如：

```javascript
import ElTest from './src/test';

/* istanbul ignore next */
ElTest.install = function(Vue) {
  Vue.component(ElTest.name, ElTest);
};

export default ElTest;

```

3. 在该组件文件目录下src文件夹里写你的vue组件，组件名例如：

###### test.vue

在test.vue文件里 name 字段的值也要与上面保持一致，写成对应的ElTest。

4. 运行

```shell
npm run dist
```

命令跑完之后会在packages/theme-default目录下自动创建该组件需要的css文件，组件样式写在这里即可。
会生成打包之后的lib文件夹。

#### 添加文档 

1. 在examples/docs目录下添加组件名字命名的md文件
2. 在examples下的nav.config.json里添加路由,路由放在最下面ifbp的组里，路由名字与组件名字保持一致。




## 代码规范
遵循饿了么前端的 [ESLint](https://github.com/ElemeFE/eslint-config-elemefe) 即可




## 工程规范


commit 信息要以[组件名]: 描述信息 的形式填写，例如 Button: fix xxx bug。

不要提交 lib 里面打包的文件。

执行 npm run dist 后可以正确打包文件。

为了兼容性以及最终打包的文件体积考虑，我们的 babel 只引入了 preset-2015，所以不建议使用 ES2015 的 API，例如 Array.prototype.find、Object.assign等。如果有需要，请引入第三方的 polyfill。


提交到 dev 分支，而不是 master 分支。


合并代码需要两名维护人员参与：一人进行 review 后 approve，另一人再次 review，通过后即可合并。


## LICENSE
MIT