1 创建项目
npm install -g express-generator
express -e myapp //创建myapp项目
npm i //安装依赖
npm i nodemon -D //安装nodemon
修改package.json
"scripts": {
"start": "node ./bin/www",
"dev": "nodemon ./bin/www"
},
运行 npm run dev
2 安装ejs
npm i ejs --save
修改脚手架app.js默认配置,原配置
// view engine setup
app.set("views", path.join(__dirname, "views"));
app.set('view engine', 'jade');
/* GET home page. */
router.get("/", function (req, res, next) {
res.render("home", {
title: "首页",
});
});
加载的是views下面的home.jade文件
修改配置render加载ejs文件
// view engine setup
app.set("views", path.join(__dirname, "views"));
// app.set('view engine', 'jade');
app.set("view engine", "ejs");
<%- include ("footer.ejs") %></div> 引用foorer.ejs
home.ejs
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="renderer" content="webkit" />
<meta
name="viewport"
content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<meta name="robots" content="noindex,nofollow" />
<meta name="generator" content="Halo 1.5.2" />
<link rel="icon" href="/favicon.ico" />
<title><%=title%></title>
<script defer="defer" src="../javascripts/home.js"></script>
<link href="../stylesheets/home.css" rel="stylesheet" />
</head>
<body>
<%- include ("base.html") %></div>
<div>我们是Homeejs
<%- include ("footer.ejs") %></div>
</body>
</html>
footer.ejs
<footer>All content copyright <%= new Date().getFullYear() %> .</footer>
base.html
<h1>我是base.html</h1>
浏览器显示
ejs里面即可引用ejs文件又可以引用html文件。
3 直接renderhtml文件
修改app.js
// view engine setup
app.set("views", path.join(__dirname, "views"));
// app.set('view engine', 'jade');
// app.set("view engine", "ejs");
app.engine(".html", require("ejs").__express);
app.set("view engine", "html");
此时是可以直接渲染home.html的。
但是使用<%- include ("base.html") %>会导致报错,无法渲染,可以使用<%- include ("footer.ejs") %>
具体解决办法目前还没有找到
//TODO。。。。。。