# 全悉前端公共组件库 quanxi-ui

https://git.in.chaitin.net/answer/quanxi-ui

- npm run dev 本地启动 demo
- npm run build 打包组件库
- npm run build:html 打包组件库 demo
  访问链接：https://answer.chaitin.page/quanxi-ui/#/docs/index

## 目录结构

<details>
<summary>点击显示目录结构详情</summary>
<pre>
├── README.md     // readme
├── build         // build:html 执行
│   └── build.ts
├── index.html
├── package-lock.json
├── package.json
├── packages      // 公共组件源码
│   ├── Button
│   │   ├── button.tsx
│   │   ├── index.ts
│   │   └── style.scss
│   ├── Card
│   │   ├── card.tsx
│   │   ├── index.ts
│   │   └── style.scss
│   ├── Confirm
│   │   ├── Confirm.tsx
│   │   ├── index.tsx
│   │   └── style.scss
│   └── index.ts
├── public
│   └── vite.svg
├── react-app-env.d.ts
├── src                     // 展示页面目录
│   ├── assets
│   │   └── react.svg
│   ├── components          // 公用组件
│   │   ├── codeView.tsx
│   │   ├── instanceView.tsx
│   │   ├── menu.tsx
│   │   ├── subtitle.tsx
│   │   └── title.tsx
│   ├── demo                // 展示demo页面 及 展示demo
│   │   ├── button.tsx      // 展示页面
│   │   └── dedicate        // demo
│   │       └── index.tsx
│   ├── index.css
│   ├── main.tsx
│   ├── pages               // 公共页面
│   │   ├── 404.tsx
│   │   ├── dedicate.tsx    // 贡献指南
│   │   ├── homePage        // 访问gitlab展示首页
│   │   │   ├── images
│   │   │   │   ├── adorn.svg
│   │   │   │   ├── css.svg
│   │   │   │   ├── ct-logo.svg
│   │   │   │   ├── ctin.svg
│   │   │   │   ├── gear.svg
│   │   │   │   ├── github-blue.svg
│   │   │   │   ├── github.svg
│   │   │   │   ├── html.svg
│   │   │   │   ├── img.svg
│   │   │   │   ├── logo.svg
│   │   │   │   └── mascot.svg
│   │   │   └── index.tsx
│   │   ├── index.tsx       // 顶部menu，左侧menu，二级路由页面
│   │   └── layout.tsx
│   ├── router              // 路由
│   │   ├── index.tsx       // 一级路由
│   │   ├── packages.tsx
│   │   └── page.tsx        // 路由配置
│   ├── styles
│   │   ├── app.scss
│   │   ├── custom.scss
│   │   ├── global.scss
│   │   ├── iconfont.scss
│   │   ├── iconfont.ttf
│   │   ├── reset.scss
│   │   └── theme.scss
│   ├── utils.tsx
│   └── vite-env.d.ts
├── tsconfig.json
├── tsconfig.node.json
├── vite.config.ts
└── yarn.lock

</pre></details>

## 本地调试组件库 npm 包

1. 全局安装 yalc
   `npm install -g yalc`

2. 修改组件库文件后，执行
   `npm run build:push`

3. 添加本地包，quanxi-platform-frontend 项目中执行
   `yalc add @quanxi/ui`
   此时，重启 quanxi-platform-frontend 项目之后，项目中的引用的就是本地组件库。

4. 更新本地包时，先执行 2，然后在 quanxi-platform-frontend 项目中执行
   `yalc update`

5. 删除本地包，quanxi-platform-frontend 项目中执行
   `yalc remove --all`