// 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")%>
*/