摘要:包与NPM Node组织了自身的核心模块,也使得第三方文件模块可以有序的编写和使用。

本文分享自华为云社区《NodeJs深入浅出之旅:包与NPM》,作者:空城机。

包与NPM

Node组织了自身的核心模块,也使得第三方文件模块可以有序的编写和使用。

但是在第三方模块中,模块与模块之间仍然是散列在各地的,相互之间不能直接引用

所以在模块外,包和NPM是将模块联系起来的机制。

  • 包组织模块示意图

CommonJS 的包规范定义其实也很简单,由包结构和包描述文件两部分组成。

包结构

用于组织包中的各种文件,是一个存档文件,即一个目录直接打包为.zip或tar.gz格式的文件。

符合规范的包目录:

  • package.json: 包描述文件
  • bin: 用于存放可执行二进制文件的目录
  • lib: 用于存放JavaScript代码的目录
  • doc: 用于存放文档的目录
  • test: 用于存放单元测试用例的代码

package.json包描述文件

NPM所有行为都与包描述文件的字段息息相关

一些字段:

  • name: 包名。 规范定义需要用小写的字母和数字组成,不允许出现空格。 包名必须是唯一的,以免对外公布时产生重名冲突
  • description: 包简介
  • version: 版本号,关于其介绍在《Node.js学习(一)——简介》也有提及
  • keywords: 关键字数组, NPM中主要用来作分类搜索。
  • maintainers: 包维护者列表。 每个维护者由name、email和web这3个属性组成。 NPM通过这个属性进行权限认证。

格式:

    "maintainers":[{ "name":"kongchengji", "email":"111@.com", "web":"[http:](https://blog.csdn.net/qq_36171287)" }]

contributors: 贡献者列表,格式与维护者列表相同

  • bugs: 一个可以反馈bug的网页地址或邮件地址
  • licenses: 当前包所使用的许可证列表,表示包在哪些许可证下使用

格式:

 "licenses":[{ "type": "GPLv2", "url":"" }]
// 或者
"license": "ISC"
  • repositories: 托管源代码的位置列表,表明可以通过哪些方式和地址访问包源代码。
    格式:
  • "repository": {
  • "type": "git",
  • "url": "git+https://github.com/kongchengji/UiSelfMade.git"
  • },
  • dependencies: 使用当前包所需要依赖的包列表。 这个属性非常重要
  • homepage: 当前包的网站地址
  • os: 操作系统支持列表, 如果列表为空,则不对操作系统做任何假设
  • cpi: CPU架构支持列表
  • engine:支持的JavaScript引擎列表
  • directories:包目录说明
  • implements: 实施规范的列表。 标志当前包实现了CommonJS哪些规范
  • scripts: 脚本说明对象。 主要用于被包管理器用来安装、编译、测试和卸载包

格式:

  "scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"lint": "eslint --ext .js,.vue src",
"build": "node build/build.js"
},

NPM与包规范区别在于多了四个字段:

  • author: 包作者 :ok_man:
  • bin: 一些包作者希望包可以作为命令行工具使用。
  • main: 模块引入包时,会有限检查这个字段,并将其作为包中其余模块的入口模块。 如果不存在,require会查找包目录下的index.js、index.node、index.json作为默认入口
  • devDependencies: 一些模块只在开发时需要依赖。

devDependencies:开发环境使用
dependencies:生产环境使用

前后端共用模块

JavaScript在Node出现后,有一项优势 --> 一些模块可以在前后端实现共用。

但是前后端上始终还是有一些差别的 :sweat_drops:

前后端模块侧重点

前后端JavaScript分别搁置在HTPP的两端,扮演的角色并不同。

浏览器端的JavaScript需要经历从同一个服务器端分发到多个客户端执行,瓶颈是带宽,从网络加载代码
服务器端的JavaScript是相同代码需要多次执行,瓶颈是CPU和内存等资源,从磁盘中加载

在前端JavaScript中,主要还是应用AMD规范

CommonJS并不完全适用于前端JavaScript,比如Node的模块引入基本是同步的,但是前端引入如果使用同步引入,UI在初始化过程中需要花费很多时间等待脚本加载完成。

AMD规范

AMD规范 是CommonJS规范的一个延伸,全称:Asynchronous Module Definition。
是异步模块定义

模块定义:define(id?, dependencies?, factory);
id 是模块的名字,它是可选的参数。

dependencies 指定了所要依赖的模块列表,它是一个数组,也是可选的参数

AMD需要在声明模块时指定所有的依赖,通过形参传递依赖到模块内容中:

define(['./a', './b'], function (dep1, dep2) {
a.doSomethimg()
b.doSomething()
});

CMD规范

与AMD规范相对的还有CMD规范,全称:Common Module Definition。
是公共模块定义

这是由国内的玉伯(也是一位大佬)提出的

模块定义:define(factory)

CMD支持动态引入:

define(function(require, exports, module) {
var a=require('./a')
a.doSomethimg()
var b=require('./b')
b.doSomething()
})

在需要依赖模块时, 随时调用require()引入即可

  • CMD 推崇依赖就近; AMD 推崇依赖前置
  • CMD 是延迟执行; AMD 是提前执行
  • CMD性能好,因为只有用户需要的时候才执行; AMD用户体验好,因为没有延迟,依赖模块提前执行了

AMD和CMD最大的区别是对依赖模块的执行时机处理不同

兼容多种模块规范

创建一个hello方法,让hello方法能在不同运行环境中运行,兼容Node、AMD、CMD和常见浏览器

  • 匿名函数前加一个;是个好习惯 name是方法名,definition是方法体
  • 通过typeof检测环境是否为AMD或CMD还是Node环境
  • 可以将模块执行结果挂载在window变量中,这样可以直接调用
// 匿名函数前加一个;是个好习惯  name是方法名,definition是方法体
;(function (name, definition) {
//检查环境是否是AMD或CMD
var hasDefine = typeof define === 'function',
// 检查环境是否为Node
hasExports = typeof module !== 'undefined' && mudule.exports; if(hasDefine) {
define(definition);
} else if (hasExports) {
module.exports = definition();
} else {
// 将模块的执行结果挂在window变量中,在浏览器中this指向window对象
this[name] = definition();
}
})('hello', function () {
var hello = function () {
console.log('hello');
}
return hello;
});

点击关注,第一时间了解华为云新鲜技术~

带你了解Node.js包管理工具:包与NPM的更多相关文章

  1. NPM 包管理工具详解,使用教程

    NPM 包管理工具 1.1 定义:什么是 NPM NPM 全称 Node Package Manager,它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具.通过 ...

  2. npm 是node.js下带的一个包管理工具

    npm 是node.js下带的一个包管理工具          npm install -g webpack webpack是一个打包工具 gulp是一个基于流的构建工具,相对其他构件工具来说,更简洁 ...

  3. Node.js权威指南 (4) - 模块与npm包管理工具

    4.1 核心模块与文件模块 / 574.2 从模块外部访问模块内的成员 / 58 4.2.1 使用exports对象 / 58 4.2.2 将模块定义为类 / 58 4.2.3 为模块类定义类变量或类 ...

  4. Node.js之包与npm包管理工具

    Node.js之包与npm包管理工具 1.Node.js中的包 1.1在一个包中包含如下内容: package.json:对包进行描述 在bin子目录中存放二进制文件 在lib子目录中存放JavaSc ...

  5. node.js中npm包管理工具

    现在安装node.js,默认就会帮我们装上了npm包管理工具,npm主要用来下载,安装,管理第三方模块. 创建一个包描述文件: npm init [-y] 查看包的信息 npm info <pa ...

  6. Node包管理工具

    Node包管理工具 只是简单的介绍一些工具的使用,有利于开发过程.除了介绍Node包管理工具,还介绍了前端打包工具,前端模块管理工具 Node包管理工具:    --npm    --cnpm    ...

  7. node的包管理工具:yarn和npm

    arn是Facebook发布的一款依赖管理工具,它比npm更快.更高效. NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题. 一.yarn官方网站: 英文官网:ht ...

  8. NodeJS包管理工具——npm入门

    如今每个语言体系中都有一个包管理工具,PHP的Composer,Ruby的gem,Python的pip,Java的Maven……当然还有Node.js的npm.有的人会奇怪为何要引入又一个新东西来让我 ...

  9. 【前端】NodeJs包管理工具NPM

    NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS部署上的很多问题. 测试是否安装成功,出现版本提示表示安装成功. npm -v NPM常用命令 官方文档:https://www.npm ...

  10. 前端工程化系列[01]-Bower包管理工具的使用

    本文主要介绍前端开发中常用的包管理工具Bower,具体包括Bower的基本情况.安装.使用和常见命令等内容,最后还介绍了依赖树管理的常见方式以及Bower采用的策略并进行了比较. 1.1 关于Bowe ...

随机推荐

  1. Stride游戏引擎试毒

    想找别的引擎用, 主要还是因为unity和国内盗版用户的互相伤害, 就算用免费的个人版也要不停的验证. stride引擎, 原名xenko, 再原名paradox... 一开始是日本厂商开发的引擎, ...

  2. SNN_TIPS

    脉冲神经网络的研究思路: ANN2SNN 代表: 梯度下降法 代表: STDP 代表: 神经网络代差划分 以神经元实现功能为准: 优势 SNN是一个动态系统,在动态识别中发挥出色,比如语音识别和动态图 ...

  3. 使用 PPO 算法进行 RLHF 的 N 步实现细节

    当下,RLHF/ChatGPT 已经变成了一个非常流行的话题.我们正在致力于更多有关 RLHF 的研究,这篇博客尝试复现 OpenAI 在 2019 年开源的原始 RLHF 代码库,其仓库位置位于 o ...

  4. CSP-J 2023 题解

    CSP-J 2023 题解 T1 小苹果 这个题直接遍历枚举必定 TLE,这是 CCF 的出题风格,每题 T1 巨水无比,但是往往又需要一些思维. 这道题我们可以发现每一轮操作都会拿走 \(1 + ( ...

  5. 一个基于.NET Core开源、跨平台的仓储管理系统

    前言 今天给大家推荐一个基于.NET Core开源.跨平台的仓储管理系统,数据库支持MSSQL/MySQL:ZEQP.WMS. 仓储管理系统介绍 仓储管理系统(Warehouse Management ...

  6. 深入了解HMAC加密技术:原理、应用与实践

    一.引言 在网络安全领域,消息认证码(MAC)是一种重要的技术手段.Hash-based Message Authentication Code(HMAC)作为其中的一种,凭借其简单.高效.安全的特性 ...

  7. 文心一言 VS 讯飞星火 VS chatgpt (151)-- 算法导论12.2 7题

    七.用go语言,对于一棵有 n 个结点的二叉搜索树,有另一种方法来实现中序遍历,先调用 TREE-MINIMUM 找到这棵树中的最小元素,然后再调用 n-1 次的 TREE-SUCCESSOR.证明: ...

  8. [python][图像切割]给定手写数字图片完成数字切割

    import torch import torch.nn as nn from torchvision import transforms from PIL import Image, ImageOp ...

  9. WordPress简码实现的一些常用的效果

    首先要确保框架里已经安装好element pro插件,下面是使用简码,来实现效果,在element中找到简码,并且在WordPress后台主题编辑器中,找到function.php文件, 显示产品的分 ...

  10. [ARC156D] Xor Sum 5

    Problem Statement You are given a sequence of $N$ non-negative integers $A=(A_1,A_2,\dots,A_N)$ and ...