npm与包,发表包和模块加载机制

501 阅读6分钟

什么是包

Node.js中的第三方模块又叫做

就像电脑计算机指的是相同的东西,第三方模块指的是同一个概念,只不过叫法不同

包的来源

image.png

为什么需要包

image.png

从哪里下载包

image.png 注意:

在项目中安装包的命令

  • 完整写法:npm install 包的完整名称(安装到默认文件夹) || npm install -S 包的完整名称(安装到当前文件夹)
  • 简写:npm i 完整的包名称 || npm install -S image.png

安装指定版本的包

npm install 包的完整名称@版本号

包的语义化版本规范

image.png

包管理配置文件

npm规定,在项目根目录中,必须提供一个叫做package.json的包管理配置文件.用来记录与项目有关的一些配置信息,例如:

  • 项目的名称、版本号、描述等
  • 项目中都用到了哪些包
  • 哪些包只在开发期间会用到
  • 哪些包在开发和部署时都需要用到

如何记录项目中安装了哪些包

项目根目录中,创建一个叫做packge.json的配置文件,即可用来记录项目中安装了哪些包。从而方便移除node_modules目录之后,在团队成员之间共享项目的源代码。

注意:今后在项目开发中,一定要把node_modules文件夹,添加到.gitignore忽略文件中

快速创建package.json

npm init -y npm包管理工具提供了一个快捷命令,可以在执行命令时所处的目录中,快速创建package.json这个包管理配置文件:

注意:

  • 上述命令只能在英文的目录下成功运行!所以,项目文件夹的名称一定要使用英文命名,不要使用中文,不能出现空格
  • 运行npm install命令安装包的时候,npm包管理工具会自动把包的名称和版本号,记录到package.json

image.png

image.png

dependencies节点的作用

dependencies包管理配置文件.gif

dependencies的作用是显示你安装所有包的版本号

一次性安装所有包

npm install || npm i

image.png 执行以上命令就是安装package.jsondependencies节点中所有的包

卸载包

npm uninstall 包的完整名称 注意:npm uninstall 命令执行成功后,会把卸载的包,自动从package.json的dependencies中移除掉。

devDependencies 节点

npm i 包名 -D npm install 包名 --save-dev 如果某些包只在项目开发阶段会用到,在项目上线之后不会用到,则建议把这些记录到devDependencies节点中 与之对应,如果某些包在开发项目上线之后都需要用到,则建议把这些包记录到dependencies节点中

image.png 我怎么判断安装到那个节点去?

我们可以去npm官网看安装教程那里会说。

为什么下包速度慢

image.png

淘宝NPM镜像服务器

image.png

切换npm的下包镜像源

下包的镜像,指的就是下包的服务器地址

  • 查看当前的下包镜像源 npm config get registry
  • 将下包的镜像源切换为淘宝镜像源 npm config set registry=registry.npm.taobao.org/

image.png

nrm

为了更方便的切换下包的镜像源,我们可以安装nrm这个小工具,利用nrm提供的终端命令,可以快速查看和切换下包的镜像源。

  • 通过npm包管理器,将nrm安装为全局可用的工具 npm i nrm -g
  • 查看所有可用的镜像源 nrm ls
  • 将下包的镜像源切换为taobao镜像 nrm use taobao

image.png

包的分类

项目包

  • npm i 包名 -D 开发依赖包 会被记录到devDependencies节点下
  • npm i 包名 核心依赖包 会被记录到dependencies节点下 image.png

全局包

  • npm i 包名 -g 全局安装指定的包
  • npm uninstall 包名 -g 卸载全局安装的包 image.png

注意:

  • 只有工具性质的包,才有全局安装的必要性。因为它们提供了好用的终端命令
  • 判断某个包是否需要全局安装后才能使用,可以参考官方提供的使用说明即可

i5ting_toc

image.png

image.png

image.png

规范的包结构

image.png

开发属于自己的包

  1. 新创一个文件作为包的根目录
  2. 在文件夹里,新创三个文件:
  • package.json(包管理配置文件)
  • index.js(包的入口文件)
  • README.md(包的说明文档)

初始化包

package.json

{
    "name": "xiao",
    "version": "1.0.0",
    "main": "index.js",
    "description": "提供铃鹿格式化时间、HTMLEscape相关的功能",
    "keywords": [
        "xiao"
    ],
    "license": "ISC"
}
  • name为上传的包名
  • version为你的包当前
  • main为入口
  • description搜索到你的包时的介绍
  • keywords搜索的关键字
  • licaense为开源协议

package.json中main属性的作用

为什么我们给定了文件夹,没有给定文件也能正常得到我们自定义的包呢?

image.png

image.png

模块化拆分

image.png

注册npm账号

访问 npmjs.com/ 网站注册

image.png

输入用户名密码邮箱点击注册账号就会向你的邮箱发送验证码

image.png

最后就注册完成

image.png

登录npm账号

npm login 输入用户名、密码、邮箱后登录成功!

前题,确保npm服务器为npm官方地址 image.png

发布包

切换到包的目录运行终端

npm publish

注意:包名不能雷同

删除已发布的包

运行npm unpublish 包名 --force命令,即可从npm删除已发布的包

注意:

  • npm unpublish 命令只能删除72小时以内的包
  • npm unpublish 删除的包,在24小时内不能重复发布
  • 发布包的时候要慎重,尽量不要往npm上发布没有意义的包

模块的加载机制

优先从缓存中加载

模块在第一次加载后会被缓存,在你多次调用require()不会导致模块被执行多次

注意:不论是内置模块、用户指定义模块、还是第三方模块,它们都会优先从缓存中加载,从而提高模块的加载效率

image.png

内置模块的加载机制

内置模块是由Node.js官方提供的模块,内置模块的加载优先级最高

指定义模块的加载机制

使用require()加载自定义模块时,必须指定以./或../开头的路径标识符。如果没有则node会把它们当作内置模块第三方模块进行加载

在使用require()导入自定义模块时,如果省略了文件的扩展名,则Node.js会按顺序分别尝试加载以下的文件:

    • 按照确切的文件名进行加载
    • 补全.js扩展名进行加载
    • 补全**.json**扩展名进行加载
    • 补全**.node**扩展名进行加载
    • 加载失败,终端报错

第三方模块加载机制

image.png

目录模块加载机制

image.png