express+ejs 的使用:修改后缀名 .ejs 、静态托管、模板路径。
// app.js 文件
/* ejs 的使用: express默认就可以集成ejs ,用了express 不需要主动引入ejs; 1、安装 ejs : npm install ejs --save 2、app.set("view engine","ejs") 3、使用: 默认加载的模板引擎的目录是 views res.render("index",{}) */ const express = require("express"); // .ejs修改后缀为 .html ① const ejs = require("ejs"); const app = express(); // .ejs修改后缀为 .html ② 配置引擎模板 app.engine("html", ejs.__express); // app.set("view engine", "ejs"); // .ejs修改后缀为 .html ,之后修改view 里边模板的后缀为 .html ③ app.set("view engine", "html"); // 指定模板位置,默认模板位置在 views // app.set("views", "bb/dd" + "/views"); // 配置静态web目录 , app.use() 是一个中间件 app.use(express.static("static")); // app.use("/fade", express.static("static")); app.get("/", (req, res) => { let slogan = "node+express+ejs"; let h4 = "<h4>h4带标签</h4>"; res.render("index", { biaoyu: slogan, dbq: h4, }); }); app.get("/news", (req, res) => { let userinfo = { name: "张三", age: 20, }; let books = [ { name: "《神雕侠侣》", count: 22 }, { name: "《雪山飞狐》", count: 85 }, { name: "《天涯明月刀》", count: 92 }, ]; res.render("news", { usrn: userinfo, books, flag: false, score: 96, }); }); // 监听端口建议写成3000端口以上 app.listen(3001); console.log("run http://127.0.0.1:3001"); /* 一、 ejs 后缀名修改为 html : 这是一个小技巧,看着 .ejs 的后缀觉得不爽,可以使用以下方式, 将模板文件的后缀名改为我们习惯的 .html 。 1、在 app.js 的上头定义 ejs : var ejs = require('ejs'); 2、注册 html 模板引擎代码 : app.engine("html", ejs._express); 3、将模板引擎换成 html : app.set("view engine", "html"); 4、修改模板文件的后缀名为 .html 。 ------------------------------------------------------------------------------------------------ 二、 利用 express.static 托管静态文件 如果你的静态资源存放在多个目录下面,你可以多次调用 express.static 中间件 ; app.use(express.static("static")); 这样,static 目录下的文件就可以访问了, http://127.0.0.1:3001/images/pic.jpg http://127.0.0.1:3001/css/style.css 或者 如果你希望所有通过 express.static 访问的文件都放在一个 虚拟目录(在项目里边不存在的目录)下面, 可以通过给静态资源指定一个挂载路径的方式来实现。 app.use("/fade",express.static("static")); 这样,就可以通过带有 /fade 前缀的地址来访问 static 目录下的文件了。 http://127.0.0.1:3001/fade/images/pic.jpg http://127.0.0.1:3001/fade/css/style.css 三、指定模板位置,默认模板位置在 views app.set("views",_dirname+"/views") _dirname : 表示当前目录, _dirname+"/views" : 表示模板文件放在当前目录的 views 目录里边 四、 ejs 引入模板 <%-include("header.ejs")%> */