vue plugins插件的使用

在入口文件配置plugins

import Vue from 'vue'
import App from './App.vue'
import router from './router/index'
import store from './store/index'

import './plugins' // 第三方插件注册
import './directive' // 全局指令注册
import './components/autoRegister' // 全局组件注册
import '@/assets/icons/icon.js' // 自动加载 svg 图标
import '@/styles/index.scss' // global css

Vue.config.productionTip = false

new Vue({
    router,
    store,
    render: h => h(App)
}).$mount('#app')

在plugins放置插件js文件

在plugins的index.js中引入

import Vue from 'vue'
import element from './element-ui'
import map from './map'
import echarts from './echarts'
import lodash from './lodash'
import dayjs from './dayjs'

/**
 * 第三方插件注册
 * 注意：需要添加自定义配置项的插件，请独立到单独文件
 */
Vue.use(element, '$ELEMENT') // Element UI
Vue.use(map, '$esri') // 初始化arcgis api【按需加载】
Vue.use(echarts, '$echarts') // echarts【按需加载】
Vue.use(lodash, '$lodash') // lodash【按需加载】
Vue.use(dayjs, '$dayjs') // 日期时间库放的组件

其中的element-ui内容

import store from '@/store'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

export default {
    install: function(Vue, name = '$ELEMENT') {
        Vue.prototype[name] = ElementUI
        Vue.use(ElementUI, {
            size: store.state.settings.elementSize
        })
    }
}