Express全系列教程之(一):Express的安裝 和第一個程序


前言

ndoe.js,一個基于javsscript運行環境的服務器語言,它的出現使得javascript有能力去實現服務器操作。在gitHub上ndoe.js的star數已接近6萬,可見其受歡迎程度;而基于node.js的Express則把原先的許多操作變的簡單靈活,一系列強大特性幫助你創建各種 Web 應用,和豐富的 HTTP 工具。使用 Express 可以快速地搭建一個完整功能的網站。

express官方網址:www.expressjs.com.cn


Express的安裝方式:

Express的安裝可直接使用npm包管理器上的項目,在安裝npm之前可先安裝淘寶鏡像:

npm install -g cnpm --registry=https://registry.npm.taobao.org

這樣我們使用cnpm的來代替npm,這使得下載速度提高很多;其次你需要在你項目目錄下運行以下指令來初始化npm,期間所有提示按enter鍵即可,這會生成package.json,它是用于描述項目文件的。

cnpm init

再輸入

cnpm install

這下項目目錄中又會多出一個叫node_modules文件夾,里面是node.js為我們提供的模塊,當然現在沒有。接下來便是真正的安裝express了,執行:

cnpm install express --save


這時,我們看到node_modules文件夾多了許多不同版本的應用文件夾,接下來執行

express --version


查看express是否安裝成功,如果顯示版本號,則安裝正確。

Express腳手架的安裝

安裝Express腳手架有兩種方式:

1、使用express-generator安裝

使用命令行進入項目目錄,依次執行:

cnpm i express-generator

可通過express -h查看命令行的指令含義

express -h

Usage: express [options] [dir]

? Options:

? ? ? ? --version? ? ? ? 輸出版本號

? ? -e, --ejs? ? ? ? ? ? 添加對 ejs 模板引擎的支持

? ? ? ? --pug? ? ? ? ? ? 添加對 pug 模板引擎的支持

? ? ? ? --hbs? ? ? ? ? ? 添加對 handlebars 模板引擎的支持

? ? -H, --hogan? ? ? ? ? 添加對 hogan.js 模板引擎的支持

? ? -v, --view <engine>? 添加對視圖引擎(view) <engine> 的支持 (ejs|hbs|hjs|jade|pug|twig|vash) (默認是 jade 模板引擎)

? ? ? ? --no-view? ? ? ? 創建不帶視圖引擎的項目

? ? -c, --css <engine>? 添加樣式表引擎 <engine> 的支持 (less|stylus|compass|sass) (默認是普通的 css 文件)

? ? ? ? --git? ? ? ? ? ? 添加 .gitignore

? ? -f, --force? ? ? ? ? 強制在非空目錄下創建

? ? -h, --help? ? ? ? ? 輸出使用方法

創建了一個名為 myapp 的 Express 應用,并使用ejs模板引擎

express --view=ejs app

進入app,并安裝依賴

cd myapp

npm install

在Windows 下,使用以下命令啟Express應用:

set DEBUG=app:* & npm start

在 MacOS 或 Linux 下,使用以下命令啟Express應用:

DEBUG=app:* npm start

app文件夾下的目錄結構


app文件夾下的目錄結構

http://localhost:3000/啟用后頁面


http://localhost:3000/啟用后頁面

2、使用 express 命令 來快速從創建一個項目目錄

express 項目文件夾的名字 -e

如? 使用命令行進入項目目錄,依次執行:

express app -e

cd app

cnpm install

這時,你也可以看到在app文件夾下的文件結構;

bin: 啟動目錄 里面包含了一個啟動文件 www 默認監聽端口是 3000 (直接node www執行即可)

node_modules:依賴的模塊包

public:存放靜態資源

routes:路由操作

views:存放ejs模板引擎

app.js:主文件

package.json:項目描述文件


第一個Express應用“Hello World”

在這里,我們不使用npm構建的腳手架,而是向最開始那樣直接在主目錄中新建一個app.js文件。


基礎項目結構

在app.js中輸入

const express = require('express'); ???????? //引入express模塊

var app=express(); ???????????????????????????????? //express()? 是express模塊頂級函數

app.get('/',function(req,res){? ? ? ? ? ? ? ? ? ? ?//訪問根路徑時輸出hello world

res.send(`<h1 style='color: blue'>hello world</h1>`);

});

app.listen(8080); ???????????????????????????????????? //設置訪問端口號

命令行進入項目文件夾后,鍵入

node app.js

即已開啟服務器,接下來只需在瀏覽器中運行 http://localhost:8080/ 就可以訪問到服務器得到響應后的數據


http://localhost:8080/的實際效果

總結

第一章的內容就是讓大家稍微認識一下express和它的安裝方法,為以后學習提供更好的鋪墊。另外小伙伴們如果有什么問題也可以留言給我,我也會耐心回答各位的問題(*^▽^*)

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容