美文网首页
在 express 项目中使用 html 模板

在 express 项目中使用 html 模板

作者: 木安小学生 | 来源:发表于2019-01-29 17:25 被阅读0次

    在 express 项目中使用 html 模板

    express默认使用jade模板,可以配置让其支持使用ejs或html模板。

    创建 项目(默认创建时 设置 使用 ejs 模板)

    express --view=ejs myapp
    

    修改入口文件 app.js 配置 html

    在 app.js 中 引入ejs 设置 html 引擎 和视图引擎

    var ejs = require('ejs)
    
    ...
    
    app.engine('html',ejs._express)
    app.set('view engine','html')
    
    

    修改前的 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 indexRouter = require('./routes/index');
    var usersRouter = require('./routes/users');
    
    var app = express();
    
    // view engine setup
    app.set('views', path.join(__dirname, 'views'));
    app.set('view engine', 'ejs');
    
    app.use(logger('dev'));
    app.use(express.json());
    app.use(express.urlencoded({ extended: false }));
    app.use(cookieParser());
    app.use(express.static(path.join(__dirname, 'public')));
    
    app.use('/', indexRouter);
    app.use('/users', usersRouter);
    
    // catch 404 and forward to error handler
    app.use(function(req, res, next) {
      next(createError(404));
    });
    
    // error handler
    app.use(function(err, req, res, next) {
      // set locals, only providing error in development
      res.locals.message = err.message;
      res.locals.error = req.app.get('env') === 'development' ? err : {};
    
      // render the error page
      res.status(err.status || 500);
      res.render('error');
    });
    
    module.exports = app;
    
    

    修改后的 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 indexRouter = require('./routes/index');
    var usersRouter = require('./routes/users');
    
    var app = express();
    
    // view engine setup
    // app.set('views', path.join(__dirname, 'views'));
    // app.set('view engine', 'ejs');
    app.set('views', path.join(__dirname, 'views'))
    // 让 ejs 模板文件 使用 扩展名 为 html 的文件
    app.engine('.html', ejs.__express)
    app.set('view engine', 'html')
    
    app.use(logger('dev'));
    app.use(express.json());
    app.use(express.urlencoded({ extended: false }));
    app.use(cookieParser());
    app.use(express.static(path.join(__dirname, 'public')));
    
    app.use('/', indexRouter);
    app.use('/users', usersRouter);
    
    // catch 404 and forward to error handler
    app.use(function(req, res, next) {
      next(createError(404));
    });
    
    // error handler
    app.use(function(err, req, res, next) {
      // set locals, only providing error in development
      res.locals.message = err.message;
      res.locals.error = req.app.get('env') === 'development' ? err : {};
    
      // render the error page
      res.status(err.status || 500);
      res.render('error');
    });
    
    module.exports = app;
    
    

    相关文章

      网友评论

          本文标题:在 express 项目中使用 html 模板

          本文链接:https://www.haomeiwen.com/subject/dinxsqtx.html