# learn_zui_sourcecode

**Repository Path**: gengwenhao/learn_zui_sourcecode

## Basic Information

- **Project Name**: learn_zui_sourcecode
- **Description**: 学习 zui 源代码
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-12-19
- **Last Updated**: 2025-08-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# zui

> ZUI 2.0 是基于[ElementUI-2.13.0](https://element.eleme.cn/#/zh-CN)实现的PC端组件库，详细使用文档参考：http://ued.dev.ztosys.com/build/docs-zui

> Node.JS 版本要求：22.12.0 
> 
> yarn 版本要求：1.22.22
> 
> 已将项目迁移到 Webpack5

## Install
```bash
npm install @zto/zui
```

## Quick Start

### 引入zui

#### 完整引入

在 main.js 中写入以下内容：

```javascript
import Vue from 'vue';
import Zui from '@zto/zui';
import '@zto/zui/lib/theme-chalk/index.css';
import App from './App.vue';

Vue.use(Zui);

new Vue({
  el: '#app',
  render: h => h(App)
});
```

#### 按需引入

借助 [babel-plugin-component](https://github.com/QingWei-Li/babel-plugin-component)，我们可以只引入需要的组件，以达到减小项目体积的目的。

首先，安装 babel-plugin-component：

```bash
npm install babel-plugin-component -D
```

然后，将 .babelrc 修改为：

```json
{
  "presets": [["es2015", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "@zto/zui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}
```

接下来，如果你只希望引入部分组件，比如 Button 和 Select，那么需要在 main.js 中写入以下内容：

```javascript
import Vue from 'vue';
import { Button, Select } from '@zto/zui';
import App from './App.vue';

Vue.component(Button.name, Button);
Vue.component(Select.name, Select);
/* 或写为
 * Vue.use(Button)
 * Vue.use(Select)
 */

new Vue({
  el: '#app',
  render: h => h(App)
});
```


### 更新发布ZUI流程

1. 根据需求或者缺陷，在`develop`分支更新好你的代码。
2. Git提交完你的修改后, 运行`npm run pub:npm`标签。
3. 待`pub:npm`运行完成后, 修改`Changelog`等文档说明内容，然后运行`npm run deploy:build`。
4. 待`deploy:build`运行完成后, 提交本地改动并推送到master分支。
5. 推送完后，切换到`develop`分支运行`git rebase master`，通过rebase操作保证develop和master分支合并。