Vue 插件如何编写

代码的书写规则如上

import Component from './component'

let componentObj={}
const install = function(Vue) {
  Vue.directive('ComponentName', Component)
}

if (typeof window !== 'undefined' && window.Vue) {
  window.ComponentName = Component
  Vue.use(install); // eslint-disable-line
}

componentObj.install = install
export default componentObj

打包规则

 vue-cli 2.0

output: {
    path: path.resolve(__dirname, './dist'),
    publicPath: '/dist/',
    filename: 'componentName.js',
    library: 'componentName', // library指定的就是你使用require时的模块名，这里便是require("componentName")
    libraryTarget: 'umd', //libraryTarget会生成不同umd的代码,可以只是commonjs标准的，也可以是指amd标准的，也可以只是通过script标签引入的。
    umdNamedDefine: true // 会对 UMD 的构建过程中的 AMD 模块进行命名。否则就使用匿名的 define。
  },

vue-cli 3.0