在windows環境下基於sublime text3的node.js開發環境搭建

bluesky4485發表於2014-08-21
WindowsNode.js開發環境

首先安裝sublime text3，百度一堆，自己找吧。理論上sublime text2應該也可以。我只能說一句：這個軟體實在是太強悍了。

跨平臺，豐富的外掛體系，加上外掛基本上就是一個強悍的ide了。目前我在使用的主要是Emmet、Python、還有一些格式化的外掛（xml，json），加上這次安裝的node.js。

node.js的安裝就不用多說了，直接http://nodejs.org/ 點選install下載window版本的安裝程式後安裝即可。預設的安裝會將安裝目錄加到path環境變數中，這一步是為了後續使用node的時候，可以不用帶路徑，當然，後續在sublime text中安裝好nodejs外掛之後，也可以對node的路徑進行一些自定義的設定。為了使用方便，建議增加到path環境變數。

SublimeText-Nodejs外掛（https://github.com/tanepiper/SublimeText-Nodejs）

原本在sublime text的外掛庫裡面有nodejs的外掛，但是經過嘗試安裝後，發現無法修改編譯設定，沒找到Nodejs.sublime-build檔案，後來在github上面看了下人家的安裝說明之後再重新安裝的。

安裝也有二種方式：

1、直接下載壓縮包後解壓到sublime text的package目錄中。檢視package目錄在哪可以通過選單欄中的Preferences-->瀏覽程式包Browse Packages直接開啟package目錄。

2、使用git命令下載到package目錄（git clone https://github.com/tanepiper/SublimeText-Nodejs "D:\ProgramFiles\Sublime Text 3\Data\Packages\nodejs"）

修改編譯選項，在package目錄下的nodejs目錄中，開啟Nodejs.sublime-build，原始內容如下：

{
  "cmd": ["node", "$file"],
  "file_regex": "^[ ]*File \"(...*?)\", line ([0-9]*)",
  "selector": "source.js",
  "shell":true,
  "encoding": "cp1252",
  "windows":
    {
      "cmd": ["taskkill /F /IM node.exe & node", "$file"]
    },
  "linux":
    {
        "cmd": ["killall node; node", "$file"]
    }
}

有2個地方需要修改，一個是編碼，為了避免亂碼code，需要改成cp936；另外一個是cmd命令，本身如果只是想簡單的執行nodejs程式的話，windows下面的cmd可以直接 "cmd": ["node", "$file"]，但是這樣非常不利於開發環境，因為這樣的話每次build都會重新啟動一個node.exe程式，且會佔用一個埠，這肯定是我們不希望的。上文中的cmd原本是想在啟動node.exe之前講node.exe程式都殺掉，然後再啟動node.exe，但是這個命令寫的不對，直接使用的話是編譯不成功的。對cmd命令需要做簡單的處理，修改好之後的Nodejs.sublime-build檔案內容如下：

{
  "cmd": ["node", "$file"],
  "file_regex": "^[ ]*File \"(...*?)\", line ([0-9]*)",
  "selector": "source.js",
  "shell":true,
  "encoding": "cp936",
  "windows":
    {
        "cmd": ["taskkill","/F", "/IM", "node.exe","&","node", "$file"]  
    },
  "linux":
    {
        "cmd": ["killall node; node", "$file"]
    }
}

重啟sublime text之後，配置就算完成了。我們寫一小段程式碼來驗證一下是否可以正常執行。

var http = require('http');
var os = require('os');
 
http.createServer(function (request, response) {
  response.writeHead(200, {'Content-Type': 'text/plain'});
  response.end('Hello World\n');
 
}).listen(3000);
 
console.log('Server running at http://127.0.0.1:3000/');
 
 
Ctrl+b編譯這段程式碼之後，sublime text視窗中就會顯示

Server running at http://127.0.0.1:3000/

若之前有執行的node程式在，則會先殺掉node程式，再啟動node，顯示如下：

成功: 已終止程式 "node.exe"，其 PID 為 154588。
Server running at http://127.0.0.1:3000/

到此，服務端算是啟動成功，開啟瀏覽器，輸入http://127.0.0.1:3000/，頁面顯示Hello World則表示互動正常。

開發環境就算是基本搭建完畢了，準備接下來一篇文章講講怎麼使用自帶的NPM包管理工具，NPM能解決nodejs程式碼部署上的很多問題。

相關文章