npm模块安装机制简介及发包流程

1、npm是什么?

npm 是 JavaScript 世界的包管理工具,而且是 Node.js 平台的默认包管理工具。经过 npm 能够安装、共享、分发代码,管理项目依赖关系。javascript

NPM 的思路大概是这样的:html

⒈ 买个服务器做为代码仓库(registry),在里面放全部能够被共享的代码java

⒉ 发邮件通知 jQuery、Bootstrap、Underscore 做者使用 npm publish 把代码提交到 registry 上,分别取名 jquery、bootstrap 和 underscore(注意大小写)node

⒊ 社区里的其余人若是想使用这些代码,就把 jquery、bootstrap 和 underscore 写到 package.json 里,而后运行 npm install ,npm 就会帮他们下载代码jquery

⒋下载完的代码出如今 node_modules 目录里,就能够在项目中随意使用了。这些能够被使用的代码被叫作「包」(package),这就是 NPM 名字的由来:Node Package(包) Manager(管理器)。git

2、安装Node.js和NPM

【1】安装node和npmgithub

npm是用node.js编写的,所以您须要安装node.js才能使用npm。npm

node.js官网下载安装包,傻瓜式安装。json

安装node.js后,就已经自带npm(包管理工具),不须要另外再进行安装npm了。bootstrap

终端输入命令检查是否安装成功,若是输出版本号,说明咱们安装node环境成功

【2】安装npm

// 安装指定版本
npm install npm @版本号

// 安装最新版本
npm install npm @latest -g

// 安装报错,提示用root权限去执行,能够执行
sudo npm install npm @latest -g

// 安装下一个未发布的npm版本
npm install npm@next -g

复制代码

3、npm安装包

【1】安装包命令

npm install <package_name> // package_name: 包名复制代码
上述命令执行以后将会在当前的目录下建立一个node_modules的目录(若是不存在的话),而后将下载的包保存到这个目录下。安装完成以后,你就可使用它了

【2】npm install 过程

① 发出 npm install 命令

② 查询node_modules目录之中是否已经存在指定模块,若存在,再也不从新安装

③ 若不存在,npm 向 registry 查询模块压缩包的网址

④ 下载压缩包,存放在根目录下的.npm目录里

⑤ 解压压缩包到当前项目的node_modules目录

注意: 一个模块安装之后,本地其实保存了两份。一份是.npm目录下的压缩包,另外一份是node_modules目录下解压后的代码。可是,运行npm install 的时候,只会检查node_modules目录,而不会检查.npm目录。也就是说,若是一个模块在.npm下有压缩包,可是没有安装在node_modules目录中,npm 依然会从远程仓库下载一次新的压缩包。

【3】强制从新安装

若是你但愿,一个模块不论是否安装过,npm 都要强制从新安装,可使用-f--force参数。

$ npm install <package-name> --force复制代码

4、npm搭档package.json

package.json文件很是重要,所以须要单独一篇文章介绍。 ★package.json文件解析

package.json用于管理你所安装的npm包的依赖,在开发过程当中能清楚的查询安装的包的版本以及项目中使用的包依赖,便于开发组成员共享。以及项目的配置信息(好比名称、版本号、项目描述、许可证等元数据)。运行npm install命令能够自动下载package.json文件中运行和开发环境中所需的依赖

【1】dependencies

--save 安装的插件 ,被写入到 dependencies 对象里面去

dependencies 里面的插件是须要发布到生产环境的。

npm install <package_name> --save复制代码
【2】devDependencies

--save-dev 安装的插件,被写入到 devDependencies 对象里面去

devDependencies 里面的插件只用于开发环境,不用于生产环境

npm install <package_name> --save-dev复制代码
【3】管理依赖关系版本

若是你有package.json文件在您的目录中,而后运行npm install,NPM将查看该文件中列出的依赖项,并下载最新版本。

5、npm update

若是想更新已安装模块,就要用到 npm update 命令。它会先到远程仓库查询最新版本,而后查询本地版本。若是本地版本不存在,或者远程版本较新,就会安装。

npm update <package_name>复制代码

6、npm uninstall

如需删除node_modules目录下面的包,请执行

npm uninstall <package>复制代码
如需从package.json文件中删除依赖,须要在命令后添加参数--save或--save-dev
npm uninstall --save <package>

npm uninstall --save-dev <package>复制代码

7、npm发包流程

【1】准备工做

① 在npm官网上注册一个帐号

② 注册成功以后,npm会发送一封邮件给你,点击邮件里面的连接,作确认关联操做(必需)

【2】建立本身的npm包

① 建立一个新目录

② 使用命令cd 进入到这个目录,执行npm init 命令初始化当前项目信息

说明:

  • package name:填写你这个包的名字,默认是你这个文件夹的名字
  • version:填写你这个包的版本,默认1.0.0
  • description:描述一下你这个包是干吗用的
  • entry point:入口文件,默认是index.js,你也能够本身填写你本身的文件名
  • test command:测试命令,默认为空,直接回车就行
  • git repository:git仓库地址,若是你的包是先放到github上或者其余git仓库里,这时候你的文件夹里面会存在一个隐藏的.git目录,npm会读到这个目录做为这一项的默认值。若是没有的话,直接回车继续。
  • keywords:关键词,方便别人搜到这个包
  • author:你的帐号
  • license: 你的这个包遵循什么开源协议,直接回车就行

而后就会问你 Is this ok?(yes),让你确认信息,直接回车键,回到目录文件夹下,多了一个package.json文件,打开这个文件里面的信息就是刚才填写的信息。

③ 在目录文件夹下新建一个index.js入口文件,里面填写须要发布的内容,例如:添加一个获取当前浏览器查询参数方法

exports.getUrlParams = function(key) {
    let search = window.location.search.replace(/^\?/, "");
    let pairs = search.split("&");
    let paramsMap = pairs.map(pair => {
        let [key, value] = pair.split("=");
        return [decodeURIComponent(key), decodeURIComponent(value)];
    }).reduce((res, [key, value]) => Object.assign(res, { [key]: value }), {});
    return paramsMap[key] || "";
}复制代码
【3】发布包

① 登陆npm,执行npm login 命令登陆,按照提示填写对应的内容

​② 在发布以前能够在npm官网里搜索一下有没有和你包名字同样的包

③ 发现已有大神使用这个包名,这时候若是执行npm publish发包命名将会报如下错误,说明名字冲突

You do not have permission to publish "get-url-params". Are you logged in as the correct user? : get-url-params复制代码
④ 打开目录下的package.json文件,修改一下name包名的值,再npm publish,发包成功

⑤ 上npm官网里搜索刚刚发布的包,如图

【3】下载测试本身发布的包

① 安装

​② 使用

import { getUrlParams } from 'get-url-query-params'
export default {
    methods: {
        getParams() {
            // 当前浏览器url为:http://localhost:8088/todayMeetingMessage.html?organizeCode=121212#/
            console.log(getUrlParams('organizeCode')) // 结果为:121212
        }
    },
}复制代码
【4】更新包

更新npm包一样是执行npm publish便可,同时须要修改版本号

最简单方式无非就是改package.json文件的version字段或者能够执行命令: npm version 1.0.1 一样能够起到修改版本号做用

对于npm包的版本号有着一系列的规则,模块的版本号采用X.Y.Z的格式,具体体现为:
一、修复bug,小改动,增长z。
二、增长新特性,可向后兼容,增长y
三、有很大的改动,没法向下兼容,增长x

【5】删除包

终端执行 npm unpublish

npm unpublish get-url-query-params@1.0.0 // 删除某个版本 @后面接版本号
npm unpublish get-url-query-params --force // 删除整个npm市场的包复制代码
相关文章
相关标签/搜索