# ming-pro

> > ming-pro组件库是对element-plus的二次封装，在使用更易用。库是依赖element-plus以及icon，使用前先安装element-plus及icon相关设置。

Latest version **1.0.3** (published 2023-04-15) · 0 weekly downloads

## Install

```sh
npm install ming-pro
pnpm add ming-pro
yarn add ming-pro
bun add ming-pro
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.3 |
| Published | 2023-04-15 |
| First published | 2022-05-18 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 8.1 MB |
| Known vulnerabilities | 0 (+2 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | shenshuai89@qq.com |
| Maintainers | shenshuai89 |
| Keywords | mingPro组件库, 前端UI库, elementUI二次封装 |

## Links

- npm: https://www.npmjs.com/package/ming-pro
- Repository: https://github.com/shenshuai89/ming-pro
- Homepage: https://github.com/shenshuai89/ming-pro#readme
- Issues: https://github.com/shenshuai89/ming-pro/issues
- npm.io page: https://npm.io/package/ming-pro

## Dependencies (3)

- [vue](https://npm.io/package/vue.md) ^3.2.25
- [element-plus](https://npm.io/package/element-plus.md) 2.0.0
- [@element-plus/icons-vue](https://npm.io/package/@element-plus/icons-vue.md) ^1.1.4

## Recent versions

- 1.0.3 (latest) — 2023-04-15
- 1.0.2 — 2022-05-23
- 1.0.1 — 2022-05-18
- 1.0.0 — 2022-05-18

## README

## ming-pro组件库
> ming-pro组件库是对element-plus的二次封装，在使用更易用。库是依赖element-plus以及icon，使用前先安装element-plus及icon相关设置。

### 直接引用
``` html
<link rel="stylesheet" href="//unpkg.com/element-plus/dist/index.css" />
<link rel="stylesheet" href="https://unpkg.com/ming-pro/lib/style.css" />
<script src="https://unpkg.com/vue@next"></script>
<script src="https://unpkg.com/element-plus"></script>
<script src="https://unpkg.com/@element-plus/icons-vue"></script>
<script src="https://unpkg.com/ming-pro/lib/ming-pro.umd.js"></script>
```
``` js
let { ref, createApp } = Vue;
let App = {
    setup() {
        const visible = ref(false);
        return {
        visible,
        };
    },
    template:
    "<h1>hello MingPro!<m-choose-icon title='图标列表' v-model:visible='visible'>选择图标</m-choose-icon></h1>",
};
let app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(`icon-${toLine(key)}`, component);
}
function toLine(value) {
    return value.replace(/(A-Z)g/, "-$1").toLowerCase();
}
app.use(ElementPlus).use(MingPro).mount("#app");
```

### 下载安装
yarn add ming-pro -D
修改main.ts
``` js
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import * as ElementPlusIconsVue from "@element-plus/icons-vue";
import MingPro from "ming-pro";
import "ming-pro/lib/style.css";

const app = createApp(App);
app.use(router).use(ElementPlus).use(MingPro).mount("#app");
```

---
_Source: https://npm.io/package/ming-pro · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._