vue-cli3.0 组件库demo 发布到 npm上开源 所遇到的问题

其实网上的文章已经有很多了，按照步骤来是没问题的，这篇文章主要是记录我在发布过程中所遇到的一些问题以及怎么处理的，希望能帮助到一些朋友。

这是我的demo目录结构，项目创建初始化后 只是增加了一个 package文件夹，其他默认的目录结构几乎没变，另外因为用到了typescript，所以会有几个声明文件，另外就是在vue-cli3.0中这个可选的vue.config.js文件，是必须得加的

贴一下config

module.exports = {
    // 将entry指向src
    pages: {
        index: {
            entry: 'src/main.js',
            template: 'public/index.html',
            filename: 'index.html'
        }
    },
    /**
     * packages 是新增的一个目录，默认是不被 webpack 处理的，所以需要添加配置对该目录的支持。
     * chainWebpack 是一个函数，会接收一个基于 webpack-chain 的 ChainableConfig 实例。允许对内部的 webpack 配置进行更细粒度的修改。
     * 为packages目录添加babel-loader处理  使 packages 加入编译
     * */
    chainWebpack: config => {
        config.module
            .rule('js')
            .include
            .add('/packages')
            .end()
            .use('babel')
            .loader('babel-loader')
            .tap(options => {
                // 修改它的选项...
                return options
            })
    }
};

问题1：在执行 “vue-cli-service build --target lib --name project-name --dest lib packages/index.js” 打包命令的时候失败，错误看不懂

类似这种，在执行打包命令的时候，有可能报很多错误，而且无从下手不知道怎么改，这个时候可能要看看package.json文件里 private 属性是否为false，该属性意思是 是否将代码开源，如果直接打包，不做配置的话，是无法打包成功的，如果实在不想公开代码，网上也有很多私有发布的教程，这里就不多做赘叙了。

问题2：打包成功但最后publish的时候为什么一直失败
这里可能有多重情况
1、遇到-4048错误 那就是没有登录，直接输入npm login，跟着步骤输入账号密码对了
2、如果下图问题的话，可能是因为之前连接了cnpm国内的淘宝镜像，这时候把地址改回来，输入以下命令
npm config set registry http://registry.npmjs.org/

3、另外一种情况就是name冲突，这种情况改一下项目名称就好

问题3：发布成功后，在项目中使用import引用自己的组件库失败，报错误 can’t find module xxxxx
在发布成功后，可以通过官网的正常命令来下载你的组件库了，不过这时候你要注意，可能如标题所述。即便安装成功后，也无法成功引用该组件库，原因有很多，其中之一可能是在组件库的package.json中的这句话没写。

  "main": "lib/mrcomponentlibrary.umd.min.js", // 该字段需指向我们最终编译后的包文件。如果不声明的话 工程中无法用import导入依赖包

注：本人也是刚开始接触这种开源组件库封装和发布，也在慢慢摸索中，该文章会持续更新 ，一起加油
2020/12/01更新