如何发布自己的npm包

• 为了提高开发效率，一些复杂的功能的实现，往往不是我们从头到尾开发的，而是用别人做好的轮子，加上自己的美化和加工制造出自己的"车子"。

• 这些轮子是以依赖包的形式（模块化开发的时候）引入我们的项目的，开发者一般会附上详细的使用说明文档，我们只要遵循文档的规范和说明，就可以轻松地实现想要的功能。

• 为什么我们非要用别人造好的轮子？
  项目复杂度 = 业务复杂度 + 功能复杂度
  从开发者的角度，想要降低功能杂度，用别人造好的轮子应该是绝大部分人首选，其他的就先不说了。

• 注册账号：
  npm

• 确保装了git、nodejs、编译器（我的是Vscode）

• 接着执行以下命令进行初始化，修改一些包的信息

npm init 

• 执行后，会生成一个文件：
  
• 命令进入包内登录你先前注册好的账号：

npm login

• 发布：

npm  publish

• 报错了
  
  因为包名被占用了，打开package.json修改name
  
  修改完后，重新执行：
  
• 然后去官网登陆自己的账号查看
  
  就可以看到刚刚发布的包：
  
  到这一步了，是不是就代表我会了？
  
  
  简单学习一下如何使用：

在原来的包文件创建一个index.js

// 获取链接参数
export function getQueryFromUrl(key) {
    let search = location.search,
        obj = {};
    search = decodeURIComponent( search.substring(1) );
    let arr = search.split('&'),
        len = arr.length,
        i;
    if( len > 0 ) {
        for( i = 0; i < len; i ++ ) {
            let subArr = arr[i].split('=');
            obj[subArr[0]] = subArr[1];
        }
    }
    return obj[key];
}
// 判断是否在微信环境
export function inWeChat(){
    var ua = navigator.userAgent.toLowerCase();
    return /micromessenger/i.test(ua);
}
// 安卓设备
export function isAndriod() {
    let ua = navigator.userAgent;
    return /android/i.test(ua);
}
// ios设备
export function isIOS() {
    let ua = navigator.userAgent;
    return /iphone|ipad|ipod/i.test(ua);
}

接着要修改一下package.json的包版本

然后重新发布：

npm  publish

从官网上可以看到这个包已经被更新了

这里我用vue的脚手架快速创建了一个vue项目，接着要在这个项目中安装并使用这个依赖包。

执行命令安装到项目中：

cnpm install tool-methods --save

在项目中可以看到已经安装的依赖包：

使用：

<template>
  <div class="hello">
    
  </div>
</template>

<script>
//导入包中的方法
import {getQueryFromUrl} from 'tool-methods';
export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  mounted(){
  //获取链接上的参数的值
   console.log(getQueryFromUrl('flat'))    
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>

如下图：