# lp-vue-release

`lp-vue-release` 是一款开箱即用的 Vue 组件库，旨在帮助开发者快速实现业务需求。它不仅提供了丰富的基础组件，还支持灵活的二次开发，搭配实用的指令和常用函数，让开发过程更加高效、便捷。无论是开发小型项目还是大型应用，lp-vue-release都能成为你的得力助手。

## 文档

完整的组件使用文档、指令说明及函数文档，请访问 [lp-vue-release](https://www.lingping.icu/notes/lp-vue-release/)

## 依赖

- [Element](https://element.eleme.cn/#/zh-CN)

- [Echarts](https://echarts.apache.org/zh/index.html)

## 安装

```shell
npm install lp-vue-release -S
```

## CDN

目前可以通过 [unpkg.com/lp-vue-release](https://unpkg.com/lp-vue-release/) 获取到最新版本的资源，在页面上引入 js文件即可开始使用。 

```javascript
<!-- 引入Vue2（必须，可自己引入其他可以访问版本） -->
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/lp-vue-release/lib/index.js"></script>
<!-- 使用 -->
Vue.use(LPVUE)
```

**演示**

```html
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" />
    <!-- 引入Vue2（必须，可自己引入其他可以访问版本） -->
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/lp-vue-release/lib/index.js"></script>
    <title>Document</title>
  </head>
  <body>
    <div id="app">
      <lp-date-picker
        v-model="time"
        type="week"
        placeholder="请选择周"
        value-format="yyyy-MM-dd"
        format="yyyy年WW周" />
    </div>
    <script>
      new Vue({
        el: "#app",
        data: {
          time: "",
        },
      });
    </script>
  </body>
</html>
```

## 快速上手

```javascript
import lpVue from 'lp-vue-release'
Vue.use(lpVue)
```

## 按需引用

```javascript
import {DatePicker} from 'lp-vue-release'
Vue.component(DatePicker.name, DatePicker);
/* 或写为
 * Vue.use(DatePicker)
 */
```

## 支持一下

开源不易，若该项目对您有帮助且能节省您的开发时间，可以请作者喝杯奶茶，你的支持是我最大的动力。

如果觉得好用，可以推荐给身边的朋友，让更多人了解并使用这个组件库。

**打赏50及以上即可联系作者索要源码**，答疑解惑都可。

<p align="center">
  <img src="https://store.lingping.icu/images/qr/zanshang.jpg" width="200">
  <img src="https://store.lingping.icu/images/qr/wx.jpg" width="200">
</p>