express 项目生成默认的视图引擎为jade,当时在开发中,我偏爱html 页面,所以本文今天介绍如何将express 默认视图引擎jade 替换为html.
第一步:打开项目的app.js 文件,app.js 部分内容如下:
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
var ejs = require('ejs');
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false}));
// view engine setup
// app.set('views', path.join(__dirname, 'views'));
// app.set('view engine', 'jade');
app.engine("html",ejs.__express);
app.set("view engine", "html");
重点:
注释代码:app.set('view engine', 'jade');
新增代码:app.set("view engine", "html");
第二步:在views 文件夹中新增login.html 文件,编辑内容如下:
<h1>登录页面</h1>
<div>
<form action="/login" method="post">
<p>
<label for="username">用户名</label>
<input type="text" id="username" name="username" placeholder="用户名">
</p>
<p>
<label for="password">密码 : </label>
<input type="text" id="password" name="password" placeholder="密码">
</p>
<p>
<input type="submit" value="登录">
</p>
</form>
</div>
第三步:重新编辑routes文件夹下的index.js,编辑内容如下:
/* GET home page. */
router.get('/', function(req, res, next) {
res.sendfile('./views/login.html');
});