$ express express-locallibrary-tutorial --view=pug
後方 tag 也可以縮寫成
-v pug
建立後會看到一堆 create :
開頭的訊息, 還有接下來可以怎麼做的指令 ( 進入目錄 、 npm i
、 設變數後啟動 )
Note: 設變數後啟動在不同作業系統會有不同的指令。 在 Windows 中, &&
跟 &
是預設成使用 Command Prompt 。 ( 我不是用 Windows , 這裡我要跳過 ... )
照著上段最後的那幾個步驟做 ( 進入目錄 、 npm i
、 設變數後啟動 ), 啟動完去瀏覽器 (http://localhost:3000/) 瞧瞧, 看到有歡迎頁就表示沒問題了
Note: 啟用也可以只輸入 $ npm start
, 指定 DEBUG
是因為可以顯示 logging/debugging 的訊息。 例如當網站被訪問時可以看到如下的訊息
$ DEBUG=express-locallibrary-tutorial:* npm start
> express-locallibrary-tutorial@0.0.0 start /Users/peterliao/Documents/鐵人賽2020/express-locallibrary-tutorial
> node ./bin/www
express-locallibrary-tutorial:server Listening on port 3000 +0ms
GET / 200 491.115 ms - 170
GET /stylesheets/style.css 200 25.615 ms - 111
每次改檔案都要關掉再開是否讓人感到厭煩呢? 讓我們告訴大家一個好消息!
這個工具 nodemon 通常是安裝成全域 , 不過為了讓其他開發者知道我們有用這個工具, 所以這邊安裝 devDependency
現在我們要來裝這自動幫我們重啟的好用工具
npm i --save-dev nodemon
如果要全域安裝
npm i -g nodemon
打開 package.json
可以看到
"devDependencies": {
"nodemon": "^1.18.10"
}
因為我們這邊不是用全域安裝, 不能直接下 command line, 但可以透過 NPM script 設定執行
打開 package.json
去找這段然後新增成如下
"scripts": {
"start": "node ./bin/www",
"devstart": "nodemon ./bin/www"
},
結束之後執行 command 修改 DEBUG
DEBUG=express-locallibrary-tutorial:* npm run devstart
Note: 現在如果專案資料夾中的檔案有任何更動, server 就會重啟, 或是在 nodemon 執行時下 command rs
也可以重啟 ( 啟動 nodemon 就會有這段提示 ) , 但我們還是需要在瀏覽器重新整理頁面。
這邊是我執行後的結果:
$ DEBUG=express-locallibrary-tutorial:* npm run devstart
> express-locallibrary-tutorial@0.0.0 devstart /Users/peterliao/Documents/鐵人賽2020/express-locallibrary-tutorial
> nodemon ./bin/www
[nodemon] 1.18.10
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node ./bin/www`
express-locallibrary-tutorial:server Listening on port 3000 +0ms
rs
[nodemon] starting `node ./bin/www`
express-locallibrary-tutorial:server Listening on port 3000 +0ms
下指令 npm run <scriptname>
會比 npm start
好, 以下是原網頁中文版本的說明
我們現在必須調用“npm run ”而不是 npm start,因為“start”實際上是映射到指定腳本的 NPM 命令。我們可以在啟動腳本中替換該命令,但我們只想在開發期間使用 nodemon,因此創建新的腳本命令是有意義的。