大体上需要以下几个步骤

1. 注册账号 https://www.npmjs.com/

2. 验证邮箱 (邮箱一定要验证通过，不然后面会出错)

3. 整理你本地的项目

以下我以一个实际项目（tao-icon）作为说明

项目设置

介绍：项目是基于vue脚手架构建为了方便引入了element-ui库，字体图标和 svg 图标库，基于 阿里图标库和 fontawesome

package.json 配置

{
  "name": "tao-icon",
  "version": "0.1.5",
    // 描述
   "description": "个人使用图标库,不建议用于生产",
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "build:lib": "vue-cli-service build --target lib --name taoIcon --dest lib src/components/index.js",
    "lint": "vue-cli-service lint"
  },
   // npm包项目的主要入口文件，必须的
  "main": "lib/taoIcon.common.js",
   // npm 上所有的文件都开启 cdn 服务地址
  "unpkg": "lib/taoIcon.umd.js",
  "style": "lib/taoIcon.css",
    // git仓库所在位置
  "repository": {
    "type": "git",
    "url": "https://gitee.com/upholdjx/tao-icon.git"
  },
    // 主页
  "homepage": "https://gitee.com/upholdjx/tao-icon",
  "author": "upholdjx",
  "keywords": [
    "icon",
    "vue",
    "components"
  ],
  "license": "MIT",//协议
  "bugs": {
    "url": "https://gitee.com/upholdjx/tao-icon/issues"
  },
  "peerDependencies": {
    "vue": "^2.6.11"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ],
    // 依赖
  "dependencies": {
    "core-js": "^3.6.5",
    "element-ui": "^2.13.2",
    "vue": "^2.6.11"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "babel-eslint": "^10.1.0",
    "babel-plugin-component": "^1.1.1",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^6.2.2",
    "svg-sprite-loader": "^4.2.1",
    "vue-template-compiler": "^2.6.11"
  }
}

package.json 中去掉文件中的 "private": true

如果 "private": true在package.json中设置，那么npm将拒绝发布它，这是一种防止意外发布私有存储库的方法。

登陆你 npm 账号

npm adduser
or
npm login
## 需要输入你的账号、密码、邮箱

前期是你npm 注册过了，并且邮箱验证是通过了的

发布你的项目

npm publish

需要注意：每次更新版本的时候，版本号一定要依次迭代，不然发布不成功

可能会出现的错误

1.问题一，镜像问题

npm ERR! code E403

npm ERR! 403 Forbidden - PUT https://registry.npm.taobao.org/lld-npm-demo - no_perms

npm ERR! A complete log of this run can be found in:

解决方案：

1.检查仓库是否被设成了淘宝镜像库(https://registry.npm.taobao.org/)

npm config get registry

2.如果设置了淘宝镜像，执行以下命令

npm config set registry=http://registry.npmjs.org

3.解决问题后重新发布

npm publish

4.发布成功以后，再设回淘宝镜像

npm config set registry=https://registry.npm.taobao.org/

2.问题二：邮箱未验证

解决方案：

3.问题三：账号未登陆

npm ERR! code E401

npm ERR! 401 Unauthorized - PUT http://registry.npmjs.org/lld-npm-demo - You must be logged in to publish packages.

4.问题四： 版本号

npm ERR! code E403

npm ERR! 403 Forbidden - PUT http://registry.npmjs.org/lld-npm-demo - You cannot publish over the previously published versions: 1.0.0.

去邮箱验证，注意邮箱是不是被屏蔽了，垃圾邮箱里面也看看

安装使用

npm install tao-icon --save
 
import taoIcon from 'tao-icon'
import "tao-icon/lib/taoIcon.css";
Vue.use(taoIcon)

图标显示组件:

<tao-icon value="fa pie-chart 32" />1
<tao-icon value="iconfont faqikaohe 32" />2
<tao-icon value="svg-icon iconchuangjianzhibiao 64" />3
// 类型 class 大小

选择图标组件

<tao-icon-select v-model="icon" /> icon:'svg-icon tao-todo 124'

总结

上面基于tao-icon 这个demo举例了下如何发布包，这个库就是个参考的，不要用于生产，一般每个项目都会遇到使用字体图标和svg 图标的，图标也是由项目决定的，不好弄到统一使用一个库，但扩展自己的还是可以了，也就介绍这么多想看这个举例项目的地址也在上面了，我放到码云上了可以找到，如果上面我写的有什么问题的欢迎下面评论讨论，一起进步！