jeft-vue

266 阅读1分钟

文档与演示

此组件库基于 vant源码借鉴开发。用于封装平时用到的组件。

:tada: 支持按需/手动/一次性引入。

:100: 引入方式类似Vant

注意

使用less - 因为vue2使用webpack4,直接使用最新less-loader会报错

npm install less less-loader@6.0.0

按需引入

按需引入使用 babel-plugin-component, babel如下:

install

npm install babel-plugin-component -D

babel.config.js

module.exports = {
presets: [
'@vue/app'
],
plugins: [
    ['import', {
        libraryName: 'vant',
        libraryDirectory: 'es',
        style: true
        }, 'vant'],
    [
    "component",
        {
        // 组件库的名字,需要和 package.json 里的 name 相同
        "libraryName": "jeft-vue",
        // 存放组件的文件夹,如果不想配置此项,默认文件夹的名字为 lib
        "libDir": "components",
        "style": true,
        "ext":".less"
        }
    ]
    ]
}

手动引入

import bMap from 'jeft-vue/components/location-map'

一次性引入

import jeftVue from '../components'

Vue.use(jeftVue)
  1. 城市选择
  2. 地图选点
  3. 柱状图
  4. 环形图
  5. notice-toast
  6. 不规则瀑布流
  7. 步骤条
  8. bg-loading
  9. directive
  10. 状态占位
  11. 规则弹出窗
  12. 上传进度展示