Vue3组件库搭建5-发布

发布代码

首先需要注意一个问题，开源和发布代码是不一样的。

开源代码：把你整个项目的源代码托管到诸如 github 或者 gitee 的地方，方便其他开发者可以看到你的源代码，从而进行膜拜和学习
发布代码：其他项目可能需要使用到我们开发的代码，这种情况往往是使用的打包后的代码，也就是 dist 里面的代码，因此在发布的时候，我们往往只发布打包后的代码，并且发布的地方一般也是 npm 上面，这样其他的开发者就可以通过 npm install 的方式来安装我们的代码并使用

要将自己的代码发布到 npm 上面，有两个步骤：

首先我们需要对 package.json 进行一些配置工作，来配置我们要发布的文件有哪些（哪些文件要上传到 npm 上面）

黑名单

在项目根目录下面创建一个 .npmignore 的文件，这个文件就类似于 .gitignore，文件里面记录哪些文件或者目录不上传

bash 复制代码

# .npmignore
src
tests

但是这种方式有一个弊端，就是一旦我们的源码发生了更改，增加了一些文件或者目录，但是这个 .npmignore 文件又没有及时的更新，就会导致一些原本不想上传到 npm 的文件或者目录上传上去。

白名单

所谓白名单模式，就是指名单里面出现的文件或者目录才会被上传至 npm。

在项目根目录下面的 package.json 中，增加 files 字段，该字段填写对应的要上传的文件或者目录

json 复制代码

"files": [
    "/dist",
    "LICENSE"
],

之后我们就可以准备开始发布。

首先你需要核对一下你的镜像，如果你要上传到 npm 上面，那么镜像就应该修改会 npm 原本的镜像，如果你是搭建的私服，要上传到私服上面，那你修改为私服所对应的镜像

接下来既然你要上传到 npm 上面，那么需要你有一个 npm 的账号，之后在项目根目录通过 npm login 登陆这个账号，如下图所示：

最后只需要通过 npm publish 这个命令进行发布即可。

至此，我们就成功的将打包后的代码进行了发布。

测试： pnpm add fuxui-plus ，报错，说找不到

解决方案：将几个包的packge.json更新为作用域包，然后将版本号version都提升一次

js 复制代码

  "version": "1.0.1",
  "publishConfig": {
    "access": "public"
  }