把vue项目或者vue组件发布成npm包或者打包成lib库文件本地使用

将vue项目发布成npm库文件，第三方通过npm依赖安装使用；使用最近公司接了一个项目，这个项目需要集成到第三方页面，在第三方页面点击项目名称，页面变成我们的项目页面；要求以npm库文件提供给他们；

发布和删除自定的npm包（基于vue/cli4）（如果是私服使用可以不发布）
1、npm源设置（项目终端中执行）
阿里云镜像：npm config set registry https://registry.npmmirror.com
npm官网：npm config set registry https://registry.npmjs.org
2、创建vue项目（vue cli）
vue create xxxx (名字自己取)
创建好后npm install
3、自己的组件
在src下面新建package包(文件夹名字随便，后面配置打包命令也要用这个名字)，分别创建一个文件夹（组件放这里面）和index.js文件
结构如下，

为了使图片能够正常打包，且从npm安装后能正常显示，需要创建vue.config.js文件（有就不用创建了），然后在该文件写上如下图所示代码 vue组件或者项目里面有图片，发布到npm图片需要正常显示

在package新建一个打包命令，打包命令里面的包名不能和package的name相同，不然上传到npm后，无法通过npm install 包名 安装；命令如下
“package”: "vue-cli-service build --target lib ./src/package/index.js/ --name xxxxx --dest xxxxx " (xxxxx是包名)

项目终端中运行npm run package会生成 xxxxx 文件夹
cd 进入 xxxxx 文件夹执行 npm init -y ,会产生一个package.json文件如下

version是版本信息，每次更新版本递增，如果想减小包体积，可以删除一些不必要的文件保留必要文件，箭头所指为必要文件；

发布包之前，把npm源更换为官网源
在包终端中执行 npm login 跟着提示填写用户名、密码、邮箱、邮箱验证码
然后执行命令 npm publish 将包上传到npm
执行 npm install xxxxx 可以下载包

同时还可以继续优化文件结构，新建style文件夹,将xxxxx.umd.min.js改为 index.js，把package的main入口改为index.js；

同时新建一个readme.md文件，描述组件使用方法

在发布包之前验证包的各项功能是否正常，可以在main.js中引入