在express網站中使用ejs模板引擎實例詳解-js教程-PHP中文網

在express網站中使用ejs模板引擎實例詳解

小云云

發布： 2018-02-03 14:43:31

原創

1700 人瀏覽過

本文主要和大家介紹在express網站中使用ejs模板引擎，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟著小編過來看看吧，希望能幫助大家。

使用vs創建的express站點，預設使用的是jade模板引擎，但是我不太喜歡這種方式，因為我覺得html本身的語義特性是我喜歡的，另外html本身也夠簡潔，使用html自身做為模板語言比較符合我的喜好，所以我選擇ejs。

1、安裝

在網站根目錄啟動控制台，輸入

npm install ejs

登入後複製

程式包會安裝到node_modules目錄下。

2 修改APP.JS

修改app.js 將view engine修改為ejs。（並將模板的後綴修改為.html）

 app.set(&#39;views&#39;,path.join(__dirname , &#39;views&#39;) );
 app.engine(&#39;.html&#39;, require(&#39;ejs&#39;).__express); 
 app.set(&#39;view engine&#39;, &#39;html&#39;);

登入後複製

3 建立測試頁面

在views資料夾中建立index.html，內容如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Pivotal Search</title>
  <meta name="description" content="">
  <meta name="author" content="">
  <!-- HTML5 shim, for IE6-8 support of HTML elements -->
  <!--[if lt IE 9]>
   <script src="http://apps.bdimg.com/libs/html5shiv/r29/html5.min.js"></script>
  <![endif]-->
  <!-- styles -->
  <link href="css/style.css" rel="external nofollow" rel="stylesheet">

</head>
<body>
    <%= title %>
</body>
</html>

登入後複製

然後在router裡修改index.js:

/* GET home page. */
router.get(&#39;/&#39;, function(req, res, next) {
  res.render(&#39;index&#39;, { title: &#39;测试11111&#39; });
});

登入後複製

php8，我來也

30分鐘學會網站佈局

尚觀Oracle入門到精通視頻教程

你的第一行UNI-APP程式碼

Flutter 從頭到應用程式啟動

兄弟連新版Linux視頻教程

AXURE 9影片教學（適用於產品經理互動產品設計UI）

零基礎PS影片教學

16天帶你入門UI視頻教程

PS技巧和切片技巧影片教學

阿裡雲環境搭建以及項目上線視頻教程

電腦網路概述－程式設計師必須掌握的基礎知識

程式設計師必備教學——HTTP協定講解

Websocket影片教學

在express網站中使用ejs模板引擎實例詳解