npm包的上传和使用，nrm的使用介绍

假设公司当前有个npm私库：http://npm.abc.cn

根据以下步骤进行分享：

1. 介绍简单包的制作，作为上传前的文件准备
2. npm登录
3. 发布刚刚制作的包
4. 在项目中引入发布的包
5. 删除发布的包
6. nrm介绍及使用

一、简单包的制作

①：新建一个文件夹

②：进入文件夹并初始化npm

成功后会生成一个package.json文件

③：创建一个app.vue页面和index.js

app.vue

<template>
  <div class="">{{text}}</div>
</template>


<script>

export default {
  name: 'Test',
  components: {},
  props: {
    text: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
    };
  },
  computed: {},
  watch: {},
  methods: {},
  created() {},
  mounted() {},
};
</script>
<style lang='scss' scoped>
</style>

index.js

import text from './app.vue'
export default text

此例子是接收一个字符串并暴露出来

至此，简单的包制作完成。

二、npm登录

npm登录指令：npm login

登录公司私库：npm login --registry http://npm.abc.cn

登陆成功。

注意：输入密码是没有显示的，闭着眼输，对就对，错就重新来。

三、发布刚刚制作的包

发布指令：npm publish

发布到公司私库：npm publish --registry http://npm.abc.cn

发布一定要注意改版本号。

简单说明一下版本号：版本号由3部分构成大版本号、小版本号和补丁修复版本号。

比方说：1.2.3中1是大版本号，除非很大改动，才会改这个版本号。2是小版本号，正常迭代会改动到此版本号，3是补丁修复和优化等，有小改动，都在此地方修改

版本号前面通常有2个常见的字符~和^，没有的话表示固定版本

~会匹配最近的小版本依赖包，比如~1.2.3会匹配所有1.2.x版本，但是不包括1.3.0

^会匹配最新的大版本依赖包，比如^1.2.3会匹配所有1.x.x的包，包括1.3.0，但是不包括2.0.0

在引用包的时候，根据情况，可以进行适当使用前缀。

如遇下面报错，检查一下登录是否正确检查下镜像代理，检查下包名在npm官网是不是已经存在了

我们换个名字再次发布

发布成功，去npm看看

四、在项目中使用

①：安装npm install wuzhiquan-npm-test --save（cnpm install wuzhiquan-npm-test --save）

安装成功。

②：引入并调用

<template>
  <div id="app">
    <test :text="'我叫吴之全'"/>
  </div>
</template>


<script>
import test from 'wuzhiquan-npm-test'

export default {
  name: 'App',
  components: {
    test
  }
}
</script>

<style>
</style>

成功输出

五、删除发布的包

删除指令：npm unpublish wuzhiquan-npm-test --force

删除公司私库的包：npm unpublish wuzhiquan-npm-test --force --registry http://npm.abc.cn

删除成功，去npm看看

六、nrm介绍及使用

nrm 是一个 npm 源管理器，允许你快速地在 npm源间切换。当然，不使用nrm也能切换源：npm set registry https://registry.npm.taobao.org/，但是如果频繁切来切去，增加操作的同时，地址难免也会不出错。还是使用管理器更加方便

首先需要全局安装：npm install -g nrm（cnpm install -g nrm）

常见指令：

①：查看可选源：nrm ls，带*表示当前使用的源

②：查看当前使用源：nrm current

③：切换源：npm user <registry>，<registry>为源名

④：添加源：nrm add <registry> <url>, <registry>为源名，<url>为地址

⑤：删除源：nrm del <registry>，<registry>为源名

⑥：测试源响应时间、访问速度：nrm test <registry>，<registry>为源名

 经测试，taobao源比npm源要快