Node.js基礎(chǔ)入門之模塊與npm包管理器使用詳解

更新時(shí)間：2022年03月21日 14:56:06 作者：小六公子

Node.js是一個(gè)基于Chrome?V8引擎的JavaScript運(yùn)行時(shí)。類似于Java中的JRE，.Net中的CLR。本文將詳細(xì)為大家介紹Node.js中的模塊與npm包管理器的使用，需要的可以參考一下

經(jīng)過第一天的學(xué)習(xí)，對(duì)Node.js有了一個(gè)初步的認(rèn)識(shí)，今天繼續(xù)學(xué)習(xí)Node.js，加以整理并分享，如有不足之處，還請(qǐng)指正。

require函數(shù)

作用：在當(dāng)前模塊中加載另外一個(gè)模塊

語(yǔ)法：require("模塊名稱")

模塊分類

在Node.js中，模塊可以分為三大類，如下所示：

1.自定義模塊：在項(xiàng)目中編寫的具有特定功能的模塊就是自定義模塊。

當(dāng)子模塊沒有暴露數(shù)據(jù)時(shí)，返回空對(duì)象，而不是undefined。
引用自定義模塊，必須在路徑前加./【如：require("./01.js")】，因?yàn)镹ode.js默認(rèn)不是當(dāng)前目錄，而是node_modules。

2.第三方模塊：第三方程序員或公司開發(fā)的模塊，需要先安裝再使用，可以通過NPM包管理器進(jìn)行安裝。

3.系統(tǒng)模塊：Node.js自帶的系統(tǒng)模塊，不需要安裝下載，直接引用即可【如：fs,http,url等】。

第三方模塊

如果要使用第三方模塊，必須要先進(jìn)行安裝，以jQuery為例，如下所示：

1. 安裝第三方模塊

安裝之前，如下所示：

通過安裝命令【npm install jquery】進(jìn)行安裝，如下所示：

安裝成功后，會(huì)自動(dòng)在程序目錄創(chuàng)建node_modules文件夾，如下所示：

2. 引入第三方模塊

當(dāng)安裝成功后，在程序中直接引用即可，如下所示：

 var jquery = require("jquery");
 console.log(jquery.toString());

3. 示例測(cè)試

在命令行進(jìn)行測(cè)試引用第三方模塊，如下所示：

注意：示例之所以報(bào)錯(cuò)，是因?yàn)閖Query是瀏覽器端的模塊庫(kù)，所以不支持服務(wù)器端調(diào)用，本次只是作為調(diào)用示例演示。

系統(tǒng)模塊

系統(tǒng)模塊是Node.js自帶的具有特定功能的模塊，不需要安裝，直接使用即可。以文件模塊為例，如下所示：

首先創(chuàng)建一個(gè)測(cè)試文件test.txt，文件內(nèi)容如下：

然后通過Node.js自帶的fs模塊進(jìn)行調(diào)用，如下所示：

 var fs =require("fs");
 fs.readFile("test.txt",function(err,data){
     console.log(data.toString());
 });

測(cè)試示例如下所示：

require注意事項(xiàng)

當(dāng)引入的模塊存在錯(cuò)誤時(shí)，會(huì)報(bào)錯(cuò)；
當(dāng)引入的模塊路徑不存在時(shí)，也會(huì)報(bào)錯(cuò)；
當(dāng)模塊被重復(fù)引用是，只會(huì)加載一次【因?yàn)榈谝淮渭虞d時(shí)，會(huì)存入緩存區(qū)，第二次加載時(shí)，會(huì)先判斷緩存區(qū)是否存在，如果存在，則直接賦值】。

關(guān)于require加載模塊示意圖，可參考下圖：

exports導(dǎo)出對(duì)象

作用：將模塊中需要共享給其他模塊的數(shù)據(jù)暴露或?qū)С龅揭锰帯?/p>

語(yǔ)法：exports.屬性或函數(shù)。

1. exports示例

如下示例：公開了一個(gè)用戶名和sayHi方法到引用處。

 var username="小六公子";
 function sayHi(){
     console.log("hi,小六子");
 }
 exports.username=username;
 exports.sayHi=sayHi;

2. exports注意事項(xiàng)

在使用exports時(shí)，注意事項(xiàng)如下：

exports等同于module.exports ，是module.exports的引用，內(nèi)存地址一致；可通過以下方式進(jìn)行判斷：

exports是一個(gè)對(duì)象，可以添加屬性和方法，但不可以修改exports指向的內(nèi)容。如下所示：

 exports.sayHi=sayHi;
 exports=sayHi;//此語(yǔ)法是錯(cuò)誤的，不能修改指向

module模塊對(duì)象

在module中最重要的就是exports對(duì)象，如下所示：

module.exports，是真正的暴露對(duì)象，exports只是對(duì)它的引用。
module.exports.屬性=值；
module.exports.方法=函數(shù);
module.exports=對(duì)象或函數(shù);//直接導(dǎo)出對(duì)象

module對(duì)象的其他屬性：

module.id 模塊的ID，即對(duì)象的唯一路徑。
module.parent 模塊的父對(duì)象。
module.filename，模塊的文件名和路徑。
module.children 子模塊，是一個(gè)數(shù)組類型。
module.paths 數(shù)組類型。當(dāng)前模塊查找對(duì)象的路徑列表。

關(guān)于module對(duì)象具體詳細(xì)信息如下所示：

package.json包描述文件

NPM【Node Package Manager】是基于Node.js的包管理工具。在Node.js項(xiàng)目中，JS的基本單位是單個(gè)文件，但是復(fù)雜的模塊往往由多個(gè)子模塊組成。為了便于管理和使用，我們可以把由多個(gè)模塊組成的大模塊稱為包，并把所有子模塊放在同一個(gè)目錄中。組成一個(gè)包的所有子模塊中，需要有一個(gè)入口，入口模塊的導(dǎo)出對(duì)象被稱為包的導(dǎo)出對(duì)象。默認(rèn)包中的入口模塊為index.js，也可以在包中新建一個(gè)package.json包描述文件，設(shè)置main屬性為模塊的入口。

1. 什么是package.json ？

package.json是node.js項(xiàng)目的包描述文件，以json格式的形式描述項(xiàng)目。以之前安裝的jQuery為例，可以查看對(duì)應(yīng)的package.json文件，如下所示：

{
  "_from": "jquery",
  "_id": "jquery@3.6.0",
  "_inBundle": false,
  "_integrity": "sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==",
  "_location": "/jquery",
  "_phantomChildren": {},
  "_requested": {
    "type": "tag",
    "registry": true,
    "raw": "jquery",
    "name": "jquery",
    "escapedName": "jquery",
    "rawSpec": "",
    "saveSpec": null,
    "fetchSpec": "latest"
  },
  "_requiredBy": [
    "#USER",
    "/"
  ],
  "_resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.0.tgz",
  "_shasum": "c72a09f15c1bdce142f49dbf1170bdf8adac2470",
  "_spec": "jquery",
  "_where": "D:\\MyProject\\DemoNodeJs",
  "author": {
    "name": "OpenJS Foundation and other contributors",
    "url": "https://github.com/jquery/jquery/blob/3.6.0/AUTHORS.txt"
  },
  "bugs": {
    "url": "https://github.com/jquery/jquery/issues"
  },
  "bundleDependencies": false,
  "commitplease": {
    "nohook": true,
    "components": [
      "Docs",
      "Tests",
      "Build",
      "Support",
      "Release",
      "Core",
      "Ajax",
      "Attributes",
      "Callbacks",
      "CSS",
      "Data",
      "Deferred",
      "Deprecated",
      "Dimensions",
      "Effects",
      "Event",
      "Manipulation",
      "Offset",
      "Queue",
      "Selector",
      "Serialize",
      "Traversing",
      "Wrap"
    ],
    "markerPattern": "^((clos|fix|resolv)(e[sd]|ing))|^(refs?)",
    "ticketPattern": "^((Closes|Fixes) ([a-zA-Z]{2,}-)[0-9]+)|^(Refs? [^#])"
  },
  "deprecated": false,
  "description": "JavaScript library for DOM operations",
  "devDependencies": {
    "@babel/core": "7.3.3",
    "@babel/plugin-transform-for-of": "7.2.0",
    "commitplease": "3.2.0",
    "core-js": "2.6.5",
    "eslint-config-jquery": "3.0.0",
    "grunt": "1.3.0",
    "grunt-babel": "8.0.0",
    "grunt-cli": "1.3.2",
    "grunt-compare-size": "0.4.2",
    "grunt-contrib-uglify": "3.4.0",
    "grunt-contrib-watch": "1.1.0",
    "grunt-eslint": "22.0.0",
    "grunt-git-authors": "3.2.0",
    "grunt-jsonlint": "1.1.0",
    "grunt-karma": "4.0.0",
    "grunt-newer": "1.3.0",
    "grunt-npmcopy": "0.2.0",
    "gzip-js": "0.3.2",
    "husky": "1.3.1",
    "insight": "0.10.1",
    "jsdom": "13.2.0",
    "karma": "5.2.3",
    "karma-browserstack-launcher": "1.4.0",
    "karma-chrome-launcher": "2.2.0",
    "karma-firefox-launcher": "1.1.0",
    "karma-ie-launcher": "1.0.0",
    "karma-jsdom-launcher": "8.0.2",
    "karma-qunit": "3.0.0",
    "load-grunt-tasks": "5.1.0",
    "native-promise-only": "0.8.1",
    "promises-aplus-tests": "2.1.2",
    "q": "1.5.1",
    "qunit": "2.9.2",
    "raw-body": "2.3.3",
    "requirejs": "2.3.6",
    "sinon": "2.3.7",
    "sizzle": "2.3.6",
    "strip-json-comments": "2.0.1",
    "testswarm": "1.1.2",
    "uglify-js": "3.4.7"
  },
  "homepage": "https://jquery.com",
  "husky": {
    "hooks": {
      "commit-msg": "commitplease .git/COMMIT_EDITMSG",
      "pre-commit": "grunt lint:newer qunit_fixture"
    }
  },
  "keywords": [
    "jquery",
    "javascript",
    "browser",
    "library"
  ],
  "license": "MIT",
  "main": "dist/jquery.js",
  "name": "jquery",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/jquery/jquery.git"
  },
  "scripts": {
    "build": "npm install && grunt",
    "jenkins": "npm run test:browserless",
    "start": "grunt watch",
    "test": "npm run test:slim && npm run test:no-deprecated && npm run test:no-sizzle && grunt && grunt test:slow && grunt karma:main && grunt karma:amd",
    "test:amd": "grunt && grunt karma:amd",
    "test:browser": "grunt && grunt karma:main",
    "test:browserless": "grunt && grunt test:slow",
    "test:no-deprecated": "grunt test:prepare && grunt custom:-deprecated && grunt karma:main",
    "test:no-sizzle": "grunt test:prepare && grunt custom:-sizzle && grunt karma:main",
    "test:slim": "grunt test:prepare && grunt custom:slim && grunt karma:main"
  },
  "title": "jQuery",
  "version": "3.6.0"
}

2. 如何創(chuàng)建package.json文件？

在node.js中，可以根據(jù)向?qū)нM(jìn)行創(chuàng)建。在命令行，切換目錄到程序所在目錄，然后輸入命令【npm init】即可開啟包文件創(chuàng)建向?qū)?。如下所示?/p>

根據(jù)向?qū)О惭b步驟依次填寫對(duì)應(yīng)信息，經(jīng)過以上7步，即可創(chuàng)建包文件，創(chuàng)建成功后在程序目錄下，如下所示：

{
  "name": "demonode",
  "version": "1.0.0",
  "description": "node示例",
  "main": "index.js",
  "dependencies": {
    "jquery": "^3.6.0"
  },
  "devDependencies": {},
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "小六公子",
  "license": "MIT"
}

注意：如果創(chuàng)建默認(rèn)package.json文件，可以采用【npm init -y】命令，一鍵生成。

NPM基礎(chǔ)

1. 常用npm命令

常用的npm命令，如下所示：

安裝命令：通過安裝包命令【 npm install 包名稱】進(jìn)行安裝指定的第三方包。
縮寫安裝命令：通過命令【npm i 包名稱】安裝指定的第三方包。
指定版本安裝：通過命令【npm i 包名稱@verson】安裝指定版本的第三方包。默認(rèn)安裝最新版本。
全局安裝：通過命令【npm i 包名稱 -g】進(jìn)行全局安裝第三方包，即可應(yīng)用于所有的項(xiàng)目。默認(rèn)全局安裝目錄【C:\Users\登錄賬號(hào)\AppData\Roaming\npm\node_modules】
安裝同時(shí)寫入依賴列表：通過命令【npm i 包名稱 --save】在安裝的同時(shí)寫入包描述文件中的依賴列表中。
安裝同時(shí)寫入開發(fā)時(shí)依賴列表：通過命令【npm i 包名稱 --save-dev】在安裝的同時(shí)寫入包描述文件中的開發(fā)依賴列表中。
查找包：通過命令【npm serach 包名稱】進(jìn)行查找。
預(yù)覽包：通過命令【npm view 包名稱】進(jìn)行預(yù)覽包的內(nèi)容。
卸載包：通過命令【npm uninstall 包名稱】進(jìn)行卸載已安裝的包。
更新包：通過命令【npm update 包名稱】更新包。

2. npm 示例

以npm的安裝和查找為例，如下所示：

cnpm基礎(chǔ)

1. 什么是cnpm ?

npm命令是需要從國(guó)外的服務(wù)器進(jìn)行下載和安裝，速度會(huì)比較慢，所有為了滿足國(guó)內(nèi)的應(yīng)用需要，cnpm應(yīng)運(yùn)而生。cnpm是淘寶提供的與npm服務(wù)器保持同步更新的軟件包鏡像。

目前cnpm的網(wǎng)址為【https://npmmirror.com/package/cnpm】，關(guān)于cnpm簡(jiǎn)介，如下所示：

2. 使用cnpm

如果要使用cnpm，可以通過命令進(jìn)行注冊(cè)，如下所示：

 npm install -g cnpm --registry=https://registry.npmmirror.com

cnpm命令使用和npm一致，加上c前綴即可。示例如下所示：

控制臺(tái)輸出

1. 控制臺(tái)常見輸出

在Node.js做為服務(wù)器端運(yùn)行時(shí)環(huán)境，所以控制臺(tái)輸出也是比較常見，如下所示：

在Node.js中，控制臺(tái)輸出有以下幾種：
console.log()，與瀏覽器中的用法一致。
console.dir() ，輸出目錄信息。
console.error(),錯(cuò)誤信息輸出。
console.time(標(biāo)識(shí)符) 與console.timeEnd(標(biāo)識(shí)符)一起使用，可以計(jì)算某段程序的執(zhí)行時(shí)間。
console.assert(條件表達(dá)式，輸出內(nèi)容);當(dāng)條件表達(dá)式為假時(shí)，輸出內(nèi)容。

2. 控制臺(tái)輸出示例

控制臺(tái)輸出的常用語(yǔ)法示例，如下所示：

console.log("我是小六子");
console.dir("我是小六子呀");
console.error("小六子出錯(cuò)了");
console.time("t1");
for(var i=0;i<99999;i++){
    //
}
console.timeEnd("t1");

示例運(yùn)行截圖，如下所示：

Node.js作用域

1. 什么是作用域？

作用域：規(guī)定了一個(gè)變量和函數(shù)可以使用的范圍，作用域分為兩種：全局作用域，局部作用域【函數(shù)作用域】。在Node.js中，一個(gè)文件就表示一個(gè)模塊，模塊中使用var定義的變量為局部變量，只能在模塊中使用。因?yàn)槟K在使用時(shí)會(huì)被Node.js編譯為一個(gè)函數(shù)。

2. 全局變量

如果將數(shù)據(jù)共享給其他模塊，可以通過兩種方法：

exports.屬性或函數(shù) 的方式導(dǎo)出。
聲明為全局變量。

全局變量，通過【global.屬性或函數(shù)=值】的方式使用。如下所示：

 var username="小六公子";
 function sayHi(){
     console.log("hi,小六子");
 }
 global.username=username;
 global.sayHi=sayHi;

調(diào)用全部變量，如下所示：

 var obj =require("./demo01-1.js");
 console.log(username);
 sayHi();

注意：global關(guān)鍵字在調(diào)用時(shí)可以省略。使用方式幾乎和exports一致。

以上就是Node.js基礎(chǔ)入門之模塊與npm包管理器使用詳解的詳細(xì)內(nèi)容，更多關(guān)于Node.js模塊 npm的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

您可能感興趣的文章: