vue-cli3 将自己写的组件封装成可引入的js文件

首先用 vue-cli 创建一个 default 项目
当前的项目目录是这样的：

首先需要创建一个 packages 目录，用来存放组件
然后将 src 目录改为 examples 用作示例

二、修改配置
启动项目的时候，默认入口文件是 src/main.js
将 src 目录改为 examples 之后，就需要重新配置入口文件
在根目录下创建一个 vue.config.js 文件

// vue.config.js

module.exports = {
   
  // 将 examples 目录添加为新的页面
  pages: {
   
    index: {
   
      // page 的入口
      entry: 'examples/main.js',
      // 模板来源
      template: 'public/index.html',
      // 输出文件名
      filename: 'index.html'
    }
  }
}

完成这一步之后就可以正常启动项目了
vue-cli 3.x  提供了构建库的命令，所以这里不需要再为 packages 目录配置 webpack

三、开发组件
之前已经创建了一个 packages 目录，用来存放组件
该目录下存放每个组件单独的开发目录，和一个 index.js 整合所有组件，并对外导出
每个组件都应该归类于单独的目录下ÿ