基于vue-cli3开发组件库---从新建文件到npm发布

安装vue-cli3并创建一个Vue项目

这部分就不用讲啦，官网上有详细的过程，我使用的主要指令为：

全局安装vue-cli

npm install -g @vue/cli

创建一个vue项目

vue create dange-ui

在项目中添加组件库文件夹

在根目录下新建一个plugins文件夹，用来放组件，项目文件结构为

添加配置文件

项目根目录下面添加vue.config.js文件，写入以下内容

const path = require('path')
module.exports = {
   
  // 修改 pages 入口
  pages: {
   
    index: {
   
      entry: 'src/main.js', // 入口
      template: 'public/index.html', // 模板
      filename: 'index.html' // 输出文件
    }
  },
  // 扩展 webpack 配置
  chainWebpack: config => {
   
    // @ 默认指向 src 目录
    // 新增一个 ~ 指向 plugins
    config.resolve.alias
      .set('~', path.resolve('plugins'))

    // 把 plugins 加入编译，因为新增的文件默认是不被 webpack 处理的
    config.module
      .rule('js')
      .include.