Npm相关的一些小东西

发表于 更新于 分类于

Npm发包以及版本号设置

将项目的组件打包发布到NPM中

  1. 注册NPM账号
  • 验证邮箱
    这个步骤必须有
    官方会给你注册的邮箱发一份邮件，如果短时间没有收到，可以耐心等待一段时间，如果长时间内没有收到官方发送的邮件，去设置里面查看一下邮件地址是否写错了
    邮件里面包含了一个验证链接，点击一下链接即可。注意一点，先在网页上登陆，然后点开邮箱里面的链接，就可以完成验证。
  1. 修改项目中的package.json文件
    注意
  • 以下只截取了修改的部分，使用时在已有的package.json文件中修改或者添加没有的即可
  • private切记一定要设置成false
  • name为发布之后的包名唯一,不能与npm仓库中已有的名称重复
  • version每次发布的版本号要不一样，否则会无法发布
  • main打包后的js文件名字
  • build指定打包的组件文件位置，如src/index.js文件里面导出的组件，下面会介绍index.js如何设置
    {
  "name": "quectel",
  "version": "1.0.0",
  "private": false,
  "main": "dist/quectel.umd.min.js",
  "scripts": {
    "build": "vue-cli-service build --target lib --name quectel src/index.js",
  }
}
    在src目录下新建一个index.js文件,index.js文件名称和位置不固定，只要和build中配置的路径位置保持一致即可
    在创建的文件中export自己的组件
    export { default as Upload } from '/components/upload'
export { default as TreeList } from '/components/treeList'
export { default as TodoList } from '/components/TodoList'
export { default as Tips } from '/components/Tips'

  1. 登陆创建好的NPM用户

    npm login
# 或者 npm adduser

    输入命令后，按照提示输入用户名、密码以及邮箱

  2. 打包

    npm run build

  3. 发布

    npm publish

  4. 发布的问题总结

  • 出现403错误，或者登陆时报错
    检查一下发布的地址，大多数国内用户会修改npm的默认镜像地址
    换回官方地址
    npm config set registry http://registry.npmjs.org
    如果安装了nrm，也可以通过nrm ls查看镜像地址，然后使用命令nrm use npm换回官方地址
    如：
$ nrm ls 
  npm ---- https://registry.npmjs.org/
* cnpm --- http://r.cnpmjs.org/
  taobao - https://registry.npm.taobao.org/
  nj ----- https://registry.nodejitsu.com/
  npmMirror  https://skimdb.npmjs.com/registry/
  edunpm - http://registry.enpmjs.org/
$ nrm use npm

修改版本号

  • 参考链接1: https://segmentfault.com/a/1190000014405355

  • 参考链接2: https://semver.org/lang/zh-CN/
    注意

  • 执行之前，确保代码已经提交 git add. && git commit -m 'message'

  • 示例：版本号：1.3.17 依次对应 major.minor.patch
    执行 npm version patch 就变成 1.3.18

  • 升级补丁版本号：

    npm version patch

  • 升级小版本号：

    npm version minor

  • 升级大版本：

    npm version major