# vue2 组件库

**Repository Path**: dhc-cli-dev/vue-element-componts

## Basic Information

- **Project Name**: vue2 组件库
- **Description**: 封装一套自己的 npm 组件库，该组件库主要是 在 vue 基础上进行封装的，也相应的封装了自己的 js 库，导出  learn_dennis_comp 组件库、learn_dennis_js  JS 库，欢迎大家一起来共同学习，有想一起开源开发的小伙伴可以一起做，可以私信我。
- **Primary Language**: JavaScript
- **License**: 0BSD
- **Default Branch**: dev
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2023-04-18
- **Last Updated**: 2023-09-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 建立自己的组件仓库，建立自己的 js 类库

### 项目效果图展示

![效果图1](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/1.png)
![效果图2](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/2.png)
![效果图3](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/3.png)
![效果图4](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/4.png)
![效果图5](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/5.png)
![效果图6](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/6.png)
![效果图5](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/7.png)
![效果图6](https://gitee.com/dhc-cli-dev/npm-plugin-library/raw/dev/public/img/8.png)

## 项目设置

```
npm install
```

### 用于开发的编译和热重新加载

```
npm run serve
```

### 用于生产的编译

```
npm run build
```

### 整理和修复文件

```
npm run lint
```

### 自定义配置

See [Configuration Reference](https://cli.vuejs.org/config/).

### 项目启动服务(8081) 同时启动 json_server(9999)

```
npm run start
```

### 快速生成组件库

```shell
npm install mddir -g

mddir

```

### 项目目录结构

```
|-- develop
|-- .gitignore
|-- babel.config.js
|-- jsconfig.json
|-- package-lock.json
|-- package.json
|-- README.md
|-- vue.config.js
|-- db
| |-- db.json
|-- public
| |-- bg.jpg
| |-- demo1.jpg
| |-- favicon.ico
| |-- index.html
|-- src
|-- App.vue
|-- main.js
|-- assets
| |-- logo.png
|-- components // 外层组件库
| |-- Layout
| | |-- Footer.vue
| | |-- Header.vue
| | |-- index.vue
| | |-- Sliber.vue
| |-- other
|-- docs // 文档说明库
| |-- product
| | |-- bankAmountInput
| | | |-- index.vue
| | |-- bankClock
| | | |-- index.vue
| | |-- bankShandowBox
| | |-- index.vue
| |-- productMethod
| | |-- moment
| | |-- NumToSimplifiedChinese
| | |-- index.vue
| |-- welcome
| |-- index.vue
|-- learn // js 库
| |-- index.js
| |-- NumToSimplifiedChinese.js
|-- package // 封装组件库
| |-- index.js
| |-- BankAmountInput
| | |-- index.vue
| |-- BankClock
| | |-- index.vue
| |-- BankList
| |-- BankShadowBox
| |-- index.vue
|-- router
| |-- index.js
|-- styles
| |-- index.less
| |-- public.less
|-- utils
|-- request.js
```

### 使用到的组件库

[Vue](https://vuejs.zcopy.site/)

[element-ui](https://element.eleme.cn/#/zh-CN)

### 自己项目库 欢迎 star ~ ~

[自己的项目库-码云](https://gitee.com/dhc-cli-dev)

[自己的项目库-github](https://github.com/ludan1107743896)