近期新參與一個(gè)項(xiàng)目，之前沒有摸過類似的。粗略看了一下，服務(wù)端居然是純js寫的，前端使用了node.js以及vue.js。粗略看了下現(xiàn)有的代碼和文檔，發(fā)現(xiàn)本地調(diào)試需要部署node.js環(huán)境以及jdk9。針對(duì)這個(gè)項(xiàng)目的請(qǐng)求現(xiàn)打到Nginx上，在此逐步記錄此學(xué)習(xí)過程。

Node.js環(huán)境搭建與初探

Node.js 是一個(gè)基于 Chrome V8 引擎的 JavaScript 運(yùn)行環(huán)境。
Node.js 使用了一個(gè)事件驅(qū)動(dòng)、非阻塞式 I/O 的模型，使其輕量又高效。
Node.js 的包管理器 npm，是全球最大的開源庫生態(tài)系統(tǒng)。

• 準(zhǔn)備工作
  • Windows10 x64
  • Node.js下載
  • 官方文檔
• 搭建環(huán)境
  • 直接安裝Node.js，官網(wǎng)下載的Windows安裝包包含了node.js和npm管理器，npm管理器簡(jiǎn)單來說就是幫你安裝以及卸載一些包。安裝完成后啟動(dòng)cmd，輸入node -v 以及npm -v查看是否安裝成功：

驗(yàn)證安裝是否成功.png

• 為了方便管理（自行設(shè)置以后安裝包的路徑和緩存路徑），新建兩個(gè)文件夾：

2.兩個(gè)文件夾.png

這兩個(gè)文件夾可以放在自己喜歡的位置。

• cmd中輸入命令，對(duì)新建的文件夾進(jìn)行設(shè)置。
  npm config set prefix "【你的路徑】"
npm config set cache "【你的路徑】"

設(shè)置兩個(gè)文件夾.png

• 編輯環(huán)境變量
  • “我的電腦”-右鍵-“屬性”-“高級(jí)系統(tǒng)設(shè)置”-“高級(jí)”-“環(huán)境變量”
    在【系統(tǒng)變量】下新建【NODE_PATH】，輸入
    你的路徑\nodejs\node_global\node_modules，將【用戶變量】下的【Path】修改為你的路徑[圖片上傳中...(4.編輯path.png-cb1506-1538018047444-0)]\nodejs\node_global
    
    編輯path.png

系統(tǒng)變量NODE_PATH.png

• 測(cè)試安裝是否成功
  • 安裝一個(gè)常見的包，測(cè)試是否成功（需要聯(lián)網(wǎng)）
    管理員下cmd窗口執(zhí)行 npm install express -g

測(cè)試安裝.png

• 查看相應(yīng)目錄下新安裝的包

查看安裝結(jié)果.png

• 小試牛刀
  新建一個(gè)名為 hello-world.js的源代碼文件。
  隨便找個(gè)編輯器中打開 hello-world.js，將下面代碼貼進(jìn)去。

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World!\n');
});

server.listen(port, hostname, () => {
  console.log(`server run on: http://${hostname}:${port}/`);
});

• 保存文件后，當(dāng)前目錄下啟動(dòng)cmd終端，輸入命令node hello-world.js啟動(dòng)腳本，命令行看到:

啟動(dòng)服務(wù)器.png

• 本地訪問http://127.0.0.1:3000/可以看到服務(wù)器解析結(jié)果
  
  訪問服務(wù)器.png