1.0.7 • Published 5 months ago

wen-vue-ui v1.0.7

Weekly downloads
-
License
-
Repository
-
Last release
5 months ago

wsm-vue-ui

一、插件描述

  • 组件是基于element-ui进行的二次封装。

二、本插件的包依赖

    "vue": "^2.6.11",
    "element-ui": "^2.13.2",
    "core-js": "^3.6.5",
    "axios": "^0.19.2",
    "qs": "^6.9.4",
    "dayjs": "^1.8.27",
    "loadsh": "^0.0.4",

五、安装使用该组件

npm install wsm-vue-ui -S

1.快速上手

本节将介绍如何在项目中使用 wsm-el-ui

你可以引入整个 wsm-el-ui,或是根据需要仅引入部分组件。我们先介绍如何引入完整的jdf-el-ui。

2.完整引入

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

import Vue from 'vue';
import Element from 'wsm-el-ui';
import 'wsm-el-ui/lib/theme/index.min.css';
import App from './App.vue';

Vue.use(Element);

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

以上代码便完成了 wsm-el-ui 的引入。需要注意的是,样式文件需要单独引入。

3.按需引入

借助 babel-plugin-component,我们可以只引入需要的组件,以达到减小项目体积的目的。

首先,安装 babel-plugin-component:

npm install babel-plugin-component -D

然后,将 .babelrc 修改为:

{
  "presets": [["es2015", { "modules": false }]],
  "plugins": [
    [
      "component",
      {
        "libraryName": "wsm-el-ui",
        "styleLibraryName": "theme"
      }
    ]
  ]
}

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

完整组件列表和引入方式

```javascript
import Vue from 'vue';
import {
 Table
} from 'wsm-el-ui';

Vue.use(Table);