express經過生成器 【 腳手架 】


express經過生成器 【 腳手架 】

1. 做用:能夠幫助快速構建一個express項目

2. 腳手架的安裝

  • 全局安裝 【能夠使用npm cnpm】
    • $ cnpm i express-generator -g
  • npx安裝
    • npx是npm下的一個管理工具,它能夠讓咱們不全局安裝使用某一個包
    • npx的好處就是能夠幫助咱們減小使用內存
    • 可是npx要求npm的版本在5.2以上
    • npx是npm自動攜帶的

3.腳手架的使用

  • 全局安裝的使用
    • $ express -e 項目名稱 (-e:--ejs)
  • npx安裝的使用
    • $ npx express -e 項目名稱

4.認識項目目錄結構

項目文件 > bin > public > routes > views app.js package.json 
- 1.先找到package.json [ 記錄了項目的依賴包信息,npm腳本 ]
{
  "name": "01-web-server-ssr", "version": "0.0.0", "private": true, "scripts": { "start": "nodemon ./bin/www" }, "dependencies": { "cookie-parser": "~1.4.4", "debug": "~2.6.9", "ejs": "~2.6.1", "express": "~4.16.1", "http-errors": "~1.6.3", "morgan": "~1.9.1" } } 
- 2.找到項目啓動文件 bin/www
var port = normalizePort(process.env.PORT || '3000'); app.set('port', port); var server = http.createServer(app); 
  • 它是經過http來作了一個服務器,默認端口是:3000node

  • 這個文件中引入了一個app文件,這個文件是將createServer中的回調函數放到了外面,以模塊化的形式使用的,這個文件咱們叫它: '入口文件'web

- 3.看: app.js
  • express是由路由和中間件構成的
    • 路由:能夠完成頁面的鏈接或是接口的打造
    • 中間件:中間件是一個函數,一個具備特定功能的函數
      • 中間件有三個類型
- 1.應用級中間件 app.use(logger('dev')); // 日誌文件記錄 app.use(express.json()); // json數據格式化 app.use(express.urlencoded({ extended: false })); // 引入文件後綴名省略 app.use(cookieParser()); // cookie處理 app.use(express.static(path.join(__dirname, 'public'))); // 指定項目靜態資源文件夾爲public - 2.路由中間件 // http://localhost:3000/users app.use('/', indexRouter); app.use('/users', usersRouter); app.use('/',homeRouter) - 3.錯誤處理中間件 // catch 404 and forward to error handler app.use(function(req, res, next) { next(createError(404)); }); // error handler app.use(function(err, req, res, next) { // set locals, only providing error in development res.locals.message = err.message; res.locals.error = req.app.get('env') === 'development' ? err : {}; // render the error page res.status(err.status || 500); res.render('error'); }); 
  • 中間件的參數
    • req : 全稱: request 表示請求
    • res : 全稱: response 表示響應
    • next: 表示request和response之間的鏈接 , 至關於橋樑的做用
    • next若是斷開,那麼請求和響應就會中斷 next( false )
  • 中間件要想調用,必須經過app的use方法來調用
- 4. 路由中間件
  • 路由中間件是以模塊化的形式使用
  • 看: routes/xx.js
    • 有兩個路徑,這兩個路徑會拼接在一塊兒
      • 舉例: /home           /banner            /home/banner 二級路由
    • 爲何res.render('index')
      • 配置了模板的路徑
      • 配置了後綴名省略
5.看: view/xxx.ejs
  • ejs語法
  • ejs文件中能夠直接在模板語法中使用數據
6。 ejs語法學習
  • 注意: ejs語法符號是不能換行的
  • 非轉義輸出 <%- %> 能夠解析xml類型數據
  • 轉義輸出 <%= %> 能夠解析普通類型數據
  • 流程控制 <% %>
    • if條件語句
    • 循環語句
相關文章
相關標籤/搜索