【Express系列】第1篇——項目建立

安裝 node 和 Express 4

node官網：http://nodejs.org/

Express Github：https://github.com/expressjs/express

 

到 node官網 下載並安裝 node 以後，打開命令行工具，執行下面命令安裝 Express：

npm install -g express-generator@4

 

安裝完成以後，咱們進入到咱們想要建立項目的目錄，執行下面命令建立一個 Express 項目：

express Express-Base

PS：上面命令中的 Express-Base 是項目名，根據你的需求隨意便可

項目結構調整

這樣就建立好了一個 Express 項目了，接下來，咱們進入剛剛建立好的項目根目錄，打開 project.json 文件，能夠看到是這樣子的：

project.json 文件的各個節點表明什麼意思我這裏就不解釋了，想了解的本身去查就是。

這裏咱們要改兩個地方：

把 scripts.start 的值改爲 "node start"

把 dependencies 的 jade 節點去掉

 

接下來，咱們把 bin 目錄下的 www 文件移到根目錄，重命名爲 start.js，而後把已經放空的 bin 文件夾刪除掉。

再打開 start.js 文件，把裏面第7行的 

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

改爲

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

 

jade 是一個模版引擎，我的以爲 ejs 已經很好用了，也很是習慣，並且因爲此次我搭建的項目是一個先後端分離的項目，用不着服務端的模版引擎，因此直接去掉不用安裝

既然咱們不用服務端渲染頁面，那麼根目錄下的 views 目錄也成多餘的了，刪掉刪掉~

而後打開項目根目錄下的 app.js 文件，找到下面關於模版引擎配置的代碼將其去掉。

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

 

再來打開命令行工具，在項目的根目錄下運行下面的指令，安裝項目依賴的基礎模塊：

npm install

 

咱們都知道，一個項目若是由多個開發者合做，編碼風格很容易會亂七八糟

這裏咱們引入一個名爲 editorconfig 工具，來規範一些基本的配置，如縮進格式，文件編碼格式等

很是簡單，在項目根目錄加入一個 .editorconfig 文件，其內容以下：

# EditorConfig is awesome: http://EditorConfig.org

# top-most EditorConfig file
root = true
# 匹配全部文件
[*]

# 使用 4 個空格縮進
indent_style = space
indent_size = 4

# Unix 風格換行模式
end_of_line = lf

# 文件爲 utf-8 格式
charset = utf-8

# 移除多餘空行的空格
trim_trailing_whitespace = true

# 行末保留一空行
insert_final_newline = true

目前不少主流的 IDE 都支持 editorconfig，像 webstorm 就默認支持，sublime text 經過安裝插件也能支持

這樣就能在必定程度上規範團隊的代碼產出風格了

 

再看一眼如今的項目目錄結構，裏面有個 public ，是用來存放 js，css，圖片等靜態資源的，但我以爲 public 這個名字好像不怎麼搭配，裏面的子目錄名稱也過長過繁瑣。

因而將 public 目錄改爲 static，裏面的子目錄先刪除掉。後面再完善裏面的內容，由於涉及到客戶端的開發工做流，比較複雜，這裏先不弄它。

目錄改完名後，打開項目根目錄下的 app.js 文件，找到下面一行代碼：

app.use(express.static(path.join(__dirname, 'public')));

將他修改爲

app.use(express.static(path.join(__dirname, 'static')));

這樣一來，之後靜態資源的存放目錄就是 static 了

 

最後，讓咱們看一眼目前的項目目錄結構：

 

因爲個人項目是在 github 上面的，因此會有一些上面沒提到的文件 

.gitignore 是 git 的文件忽略配置

README.md 是項目的說明 markdown 文件