使用脚手架新建vue项目（以button 组件为例）
1.新建package 文件夹，添加index.js 、custombutton 文件夹，custombutton 中 添加
custombutton .vue
index.js

<template><div>button</div>
</template><script>
export default {name: 'custombutton '
}
</script><style>
</style>

import custombutton from './custombutton .vue';
// 此处为按需加载使用
canvasBroad.install = Vue => Vue.component(canvasBroad.name, canvasBroad);//注册组件export default custombutton 

packages/index.js

import custombutton from './custombutton/index ' // 存储组件列表
const components = [custombutton
]// 定义 install 方法，接收 Vue 作为参数。如果使用 use 注册插件，则所有的组件都将被注册
const install = function (Vue) {
// 判断是否安装
if (install.installed) return// 遍历注册全局组件components.map(component => Vue.component(component.name, component))
}// 判断是否是直接引入文件
if (typeof window !== 'undefined' && window.Vue) {install(window.Vue)
}export default {// 导出的对象必须具有 install，才能被 Vue.use() 方法安装install,// 以下是具体的组件列表...components
}

在package.json 添加

"lib": "vue-cli-service build --target lib --name custom --dest lib packages/index.js"