快速入門node.js(持續更新中)
阿新 • • 發佈：2019-01-02
node -v檢測版本 new-cmd 外掛 Code Runner 外掛 前提條件必須在一個區域網 區域網: win+r 輸入cmd +ipconfig 找到乙太網ipv4 192.168.20.129 環境配置: 1.安裝node.js 2.cmd黑視窗輸入 npm i live-server -g 3.live-server --host=ip地址 192.168.20.78 Ctrl+c關閉 找檔案 zepto-master 找make檔案 新增模組zepto event ajax form ie fx touch selector 定製npm run-script dist------------差什麼下載什麼------------ 解決: cannot find module "epress" 方法1: cnpm i express -S //中國的 方法1: npm i express -S 方法2: 1.刪除 node_modules 2.npm i ------------差什麼下載什麼/------------ 學習 Node.js 可以做什麼 - 像 PHP 一樣，使用 Javascript 編寫符合規範的後端 API 介面 或 網站 - 使用 Node.js 開發一些實用的工具 或 包 - 基於 Socket 技術，開發類似於聊天室之類的即時通訊專案- 基於 Electron 環境，開發桌面軟體 - ect... ----------------------------------------------------------- 1.9.2. 8.2 安裝和解除安裝全域性包（i5ting_toc） 什麼是全域性的包：安裝到計算機全域性環境中的包，叫做全域性包；安裝的全域性包可以在當前電腦的任何目錄下，直接通過命令列來訪問； 如何安裝全域性包：執行 npm install 包名 -g 即可；其中 -g 引數，表示 把包安裝到全域性目錄中的意思； 全域性包的安裝目錄：C:\Users\使用者目錄\AppData\Roaming\npm 什麼樣的包適合安裝到全域性：工具性質的包，適合安裝到全域性； 如何解除安裝全域性包：要解除安裝某個全域性的包，直接執行npm uninstall 包名-g即可；其中 uninstall 表示解除安裝的意思； -g -S (區域性開發環境) -D(區域性環境dev測試環境) 1.下載 npm install 包名 -g (全域性) 一:下載: npm i i5ting_toc -g 二: 轉換: npm i i5ting_toc -f 檔案目錄 -o (-o下載完畢開啟) 三:解除安裝:npm uninstall 檔案目錄 -g 2.安裝區域性包 1.npm init -y (初始化包配置檔案) 2.npm install jquery -S (-S 等價於--save) 3.npm install (他會去找當前目錄package.json看裡面有什麼,會幫你下載什麼) 4.npm uninstall 包名 -S 解除安裝 5.--sace(-S) 3.解決下載慢問題 cnmp (中國cnmp) 中國淘寶映象 http://npm.taobao.org/ npm install -g cnpm --registry=https://registry.npm.taobao.org --------------------------------- 自動重啟伺服器 ----------------------------------- npm i nodemon -g 1. 使用 nodemon 工具來自動重啟web伺服器 - nodemon的作用：能夠實時監聽當前專案中，檔案的變化；只要監聽到了檔案的變化，則 nodemon 工具，會自動重新啟動 web 伺服器，從而使最新的程式碼生效；免去了程式設計師手動重啟伺服器的困擾； - 如何安裝：執行 npm i nodemon -g 全域性安裝即可； - 如何使用： - 之前使用 node 要執行的檔案路徑 來執行 Node.js 程式碼； - 現在使用 nodemon 要執行的檔案路徑 來執行 Node.js 程式碼； - 注意：今後在開發Web專案的時候，推薦使用 nodemon 來啟動 web 伺服器 ------------------------------------- express框架的安裝 express 框架的安裝和基本使用 1. 安裝：執行 npm i express -S 即可安裝 2. 建立基本的 express 伺服器： - 匯入 express 第三方模組； - 建立伺服器的例項：呼叫 const app = express() 方法； - 通過 app.get() 或 app.post() 方法，來監聽客戶端的 get 或 post 請求，具體語法： - 監聽 GET 請求：app.get('請求地址', (req, res) => { 處理函式 }) - 監聽 POST 請求： app.post('請求地址', (req, res) => { 處理函式 }) - 啟動 express 伺服器：通過 app.listen(埠, IP地址, 啟動成功後的回撥函式) 啟動伺服器； --------------------------------------------------- express 中的快捷方法 1. res.send() 1. 支援 傳送 字串 Content-Type: text/html; 2. 支援 傳送 物件 或 陣列 Content-Type: application/json 3. 支援 傳送 Buffer 此時會當作檔案下載； 2. res.sendFile() - 用法1：res.sendFile(path.join(__dirname, './view/index.html')) - 用法2：res.sendFile('./view/movie.html', { root: __dirname }) - 注意：res.sendFile() 可以向瀏覽器傳送 靜態頁面； ------------------------------------------- express.static託管資源 如果我們網站中，有很多靜態資源需要被外界訪問，此時，使用 res.sendFile 就有點力不從心了; 這時候，express 框架，為我們提供了 express.static('靜態資源目錄') 來快速託管指定目錄下的所有靜態資原始檔； 1. 語法1： app.use(express.static('public')); - app.use()方法，是專門用來註冊 中介軟體； - express.static 是express的內建中介軟體； 2. 語法2：app.use('/虛擬目錄', express.static('public')) ------------------------------------------- exppress框架配置模板引擎渲染動態頁面 1. 安裝 ejs 模板引擎npm i ejs -S 2. 使用 app.set() 配置預設的模板引擎 app.set('view engine', 'ejs') 3. 使用 app.set() 配置預設模板頁面的存放路徑 app.set('views', './views') 4. 使用 res.render() 來渲染模板頁面res.render('index.ejs', { 要渲染的資料物件 })，注意，模板頁面的 字尾名，可以省略不寫！ express框架中提供的路由來分發請求 1.什麼是路由:路由就是對應關係 2.什麼叫做後端路由:前端請求的URL地址,都要有一個後端對應的函式處理 .這種叫做對應關係,就叫做後端路由 3.在Express中，路由的主要職責 就是 把請求分發到對應的處理函式中； 4.在Express中，如何 定義並使用路由呢？ --------------------------------- - // 1. 封裝單獨的 router.js 路由模組檔案 const express = require('express') // 建立路由物件 const router = express.Router() router.get('/', (req, res)=>{}) router.get('/movie', (req, res)=>{}) router.get('/about', (req, res)=>{}) // 匯出路由物件 module.exports = router ------------------------------------ 5.express 建立的 app 伺服器，如何使用 路由模組呢？ ----------------------------------- // 匯入自己的路由模組 const router = require('./router.js') // 使用 app.use() 來註冊路由 app.use(router) -----------------------------