Node.js

Node.js 是一個基于 Chrome V8 引擎的 JavaScript 運(yùn)行時。

Node.js 并不是運(yùn)行在瀏覽器里的一個庫或框架。

Node.js 可以提供了一系列服務(wù)端能力，如 HTTP 服務(wù)、讀寫本地文件等，開發(fā)者可以利用 JavaScript 來使用這些能力，因?yàn)榍岸碎_發(fā)者的主要語言就是 JavaScript，所以利用 Node.js 可以降低學(xué)習(xí)成本，讓前端開發(fā)者更容易接觸到服務(wù)端開發(fā)。

1. 安裝 Node.js

Node.js 需要單獨(dú)安裝，進(jìn)入 Node.js 官網(wǎng) 獲取對應(yīng)平臺的安裝包下載即可。

如果是為了學(xué)習(xí)使用，建議使用最新版，支持更多的特性。

Node.js 的安裝過程和普通軟件相似，安裝完畢后可以通過命令行測試是否安裝成功。

1.1 windows 下打開命令提示符

windows 下可以直接在開始中進(jìn)行搜索，搜索命令提示符，打開搜索結(jié)果。

打開后在命令提示符中輸入 node -v 并回車，如果有正確輸出安裝的 Node.js 的版本號，則表示安裝成功。

1.2 Mac OS 下打開終端

在 Mac OS 操作系統(tǒng)下，打開 聚焦搜索 ，輸入 終端 后回車即可打開終端。

打開終端后輸入 node -v，如果正確輸出了版本號，則表示安裝成功。

因?yàn)閮蓚€平臺下的命令幾乎一致，后續(xù)內(nèi)容不再區(qū)分平臺，統(tǒng)一使用 Mac OS 下的終端。

2. npm

Node.js 安裝后，會同時安裝 npm，和查看 Node.js 的版本一樣，在終端里輸入 npm -v，即可查看到 npm 的版本號。

npm -v

npm 的全稱是 Node Package Manager，翻譯過來就是 node.js 的包管理工具。

一個項(xiàng)目開發(fā)過程中需要許多第三方的代碼，比如一些框架，這些框架大部分都會被做一個 npm 包 發(fā)布，通過 npm 命令行工具就可以安裝到本地項(xiàng)目中，進(jìn)行使用。

同樣的可以自己開發(fā)一些 包，發(fā)布到 npm，然后造福社會。

2.1 創(chuàng)建一個包

一個 npm 包 由一個 package.json 文件描述。

package.json 所在的位置通常會被作為項(xiàng)目的根目錄。

可以通過 npm 提供的命令創(chuàng)建一個 package.json，可以先創(chuàng)建一個項(xiàng)目目錄，然后在終端中進(jìn)入到這個目錄，使用 npm init -y 命令，就可以創(chuàng)建一個最簡單的 package.json。

當(dāng)然現(xiàn)在的工程化的前端項(xiàng)目，也會用 package.json 來描述項(xiàng)目信息，來管理依賴、工作里等，一個包不一定要發(fā)送到 npm 上。

2.2 package.json 簡析

package.json 中有許多項(xiàng)目，描述了不同的信息。

這里介紹幾個常用的字段。

2.1.1 devDependencies

{
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-proposal-decorators": "^7.3.0"
  }
}

devDependencies 記錄了一些開發(fā)依賴，這些依賴在生產(chǎn)環(huán)境不會使用。

如一些代碼檢查工具，因?yàn)橹挥性陂_發(fā)、編譯階段需要檢查代碼，最終跑上線的代碼已經(jīng)在運(yùn)行了，不需要再進(jìn)行語法、規(guī)范檢查。

2.1.2 dependencies

"dependencies": {
  "md5": "^2.2.1"
}

dependencies 記錄了生產(chǎn)、開發(fā)環(huán)境都會用到的依賴。

如 jquery，這樣實(shí)實(shí)在在跑在項(xiàng)目里，支撐起項(xiàng)目功能的依賴。

2.1.3 scripts

{
  "scripts": {
    "dev": "echo \"development\""
  }
}

scripts 可以說是直接接觸到的最常用的一個配置項(xiàng)。

配置 script 可以完成一些簡單的工作流，或者把復(fù)雜的命令配置為一個別名。

如配置的 dev 項(xiàng)，就可以通過在終端輸入 npm run dev 來調(diào)用。

同時 script 還提供了前置和后置鉤子，具體可以參閱文檔。

3. 體驗(yàn) Node.js

知道了 npm 和 node.js 的關(guān)系，了解了 package.json 的作用，就可以來嘗試使用 Node.js 做應(yīng)用了。

3.1 讀寫文件

在終端使用 node js文件.js 就可以使用 Node.js 執(zhí)行 .js 文件。

在 Node.js 中，處理文件需要使用 fs 模塊。這個模塊是 Node.js 自帶的，可以直接引入。

首先創(chuàng)建一個 .js 文件，然后在同級目錄下，創(chuàng)建任意的文本文件。

// app.js
var fs = require('fs');

var text = fs.readFileSync('./text.txt', 'utf-8');

console.log(text);

寫完這三行代碼，保存后就可以去終端執(zhí)行代碼了。

fs 模塊的 readFileSync 方法，表示可以同步的讀取一個文件，然后將讀取到的文件放在 text 變量中。

隨后將讀取到的文件進(jìn)行輸出。

fs 文件非常重要，一些特殊的配置文件，如 YAML 配置文件，就需要 fs 模塊讀取，在或者是靜態(tài)資源，也需要用 fs 模塊讀取或者寫入。

fs 模塊通過 require 引入，Node.js 支持 commonjs規(guī)范，通過 commonjs規(guī)范 來處理模塊。

新版的 Node.js 已經(jīng)支持 ES Module，需要修改 package.json 中的 type 選項(xiàng)為 module。

3.2 使用 npm 包

md5 是很常用的加密算法，但通常又不可能自己去實(shí)現(xiàn)一遍，快速迭代的項(xiàng)目可以 拿來主義，有現(xiàn)成的方案直接拿來用。

在 npm 上有一個 md5 包，就可以拿來計(jì)算 md5。

首先在一個空目錄創(chuàng)建一個 package.json，用來描述項(xiàng)目信息，然后安裝 md5。

npm init -y

npm i md5

然后新建一個 .js 文件，嘗試著使用 md5 這個包。

// app.js
var md5 = require('md5');

var password = '123456';

var encode = md5(password);

console.log(encode);

安裝好的包直接通過 require 引入，然后跟著包的文檔使用即可。

4. 小結(jié)

Node.js 目前生態(tài)主要集中在前端工具上，大眾的前段工程化的解決方案，都是由 Node.js 來驅(qū)動完成。

作為前端開發(fā)者，基礎(chǔ)的使用 Node.js 已經(jīng)是必備技能，許多針對項(xiàng)目的自動化的流程工具，都需要前端開發(fā)者自己動手實(shí)現(xiàn)。