Express ejs 3.*版本不支持 layout.ejs?
发布于 10 年前 作者 iln168 17857 次浏览 最后一次编辑是 6 年前

今天按教程写了一些测试代码 测试Express 模板引擎为ejs,如果我如何配置参数都不能使用layout.ejs 或其它。后来通过google 发现ejs 3.*以后版本不支持那种用法。

29 回复

可以用include

是的 请加载express-partials

小弟是初学的,有没有参考代码啊

如何加载express-partials

在package.json里面的dependencies添加"express-partials": "*" 然后运行cmd并切换至项目目录运行npm install获得最新版。 app.js里面引用express-partials: 1 添加引用var partials = require(‘express-partials’); 2 在app.set(‘view engine’, ‘ejs’);下面添加app.use(partials());

@duyinghua 哥终于可以了,谢谢你的方法。顺便问一下如何设置头像

@iln168 在任何论坛随便发个帖子带个图片,然后得到图片url复制过来

@iln168 呃…慢慢学习吧

@duyinghua 哥随便再请教你一个问题 不知道你看过Node.js开发指南没,上面有一个例子讲到express的用法其中 app.use(express.router(routes))代替app.use(app.router) 后错误我用console.log(typeof express.router)为undefined. 这是什么回事

用include如何实现啊

@iln168 那本书已看完了,这个不要这么用了,一定是3.0也有区别了。给你看看我的方法吧,不知道能不能帮到你,其实就是把配置跳转的信息抽出到一个js里面了,ctrl.js有点类似spring的配置xml吧 app.js代码:

     var routeCtrl = require("./controller/ctrl"),
     controllers = require('./controller/controllers');
...
     routeCtrl(app, controllers);

ctrl.js代码:

module.exports = function (app, routes) {
    app.get('/',routes.index);
    app.get('/', routes.main);
};

controllers.js代码:

exports.index = function (req, res) {

    res.render('index', { title:'首页'});
};
exports.main = function (req, res) {
    res.render('main', {layout:'main_layout', title:'主页'});
};

根据这个思路可以自行扩展

@duyinghua 你这种方法比书上的好多 了,可以了谢了

也碰到这个问题。

我就是这个问题转用 swig 了。

@duyinghua 菜鸟在此谢过。这样能减少代码冗余。

我其实挺赞同express去掉layout的支持, 其实master, layout这种布局蛮局限的, 比如你的master里有一些公用的css,而每个view又有一些独立的css,这时候你就很纠结怎么写,如果把所有的css都写在master里肯定会造成页面加载的时候加载了很多不需要的css, 如果把css分散到每个view里面去,因为head是在master里的,view的css只能写在body里,这样页面加载的时候一开始就会有错乱

其实3.1 以后 直接 app.engine('.html', require('ejs').__express); 就可以注册模板引擎了

新版本改成了 <%- include file.ejs %>

具体使用方法如下:

  1. views文件夹 下新建header.ejs,插入代码

    <html> <head> <meta http-equiv=“Content-Type” content=“text/html; charset=UTF-8”> <title>Index</title> <link rel=“stylesheet” href=“stylesheets/style.css”> </head> <body>

  2. views文件夹 下新建footer.ejs,插入代码

    </body> </html>

  3. 修改index.ejs的代码如下

    <%- include header %> Hello,world! <%- include footer %>

这个办法不错,和PHP的思路一样。

@duyinghua 你好 我想问下,我用的是express3.0,当我用npm install express-partials时,它就报错了,想问下,怎么修正?

虽然这个是express github 中的demo,但是我不认同这种include方法 这样写的话,完全破坏了页面片段的完整性 我认为layout是完整的共同框架,里面会有很多个坑,一些placehold 然后到具体的页面片段中,由该页面判断来决定去使用哪个框架layout,然后该页面片段也可以把自己声明成placehold

include是标准做法哈哈

传变量到layout里。

最近也在郁闷这问题,include太丑了,还好找到这个:express-ejs-layouts

这个又解决了我的困惑,我作为初学者,正在踩一个个的坑,感谢,非常感谢这些布道者~~

的确不支持了,方法好多啊,要学习了

回到顶部