vue如何发npm包

对比react来说，vue发npm包尤为简单。vue-cli脚手架中已经集成了打为npm包的方式，直接省去了webpack或者rollup这一步。
在package.json文件中，写入命令

"scripts": {
    "lib": "vue-cli-service build --target lib --name antd-vue-yan --dest lib ./src/components/index.js" 
},
// --target lib 打包为npm包，默认不写就是打包成应用
// --name antd-vue-yan 包名
// --dest lib ./src/components/index.js 从src/components/index.js入口文件打包到lib目录中

这样打包后有一个问题，css被抽离了，使用时还要单独引入
可以在vue.config.js文件中配置一下

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  css: {
    extract: false
  }
})

这样打包后就不用单独引入css了。

最后在lib目录中执行npm发包命令即可。具体可看react组件发布到npm的教程

点击这里查看我发布成功的第一个包