有没有办法在Express + Node.js中使用多个视图引擎？

Question

Scenario: 我使用Node.js、Express + Handlebars作为视图引擎和MongoDB开发了一些事务页面。

现在的问题是，在模块集成期间，我得到了一些基于Express + Jade作为视图引擎构建的页面。

Question: 如何集成基于Handlebars和Jade构建的页面？

- Amol M Kulkarni

---

你能展示一下你如何处理识别页面的问题吗？ - Lion789

@Lion789：你可以从文档的consolidate.js笔记中查看。"使用cons.hogan来使用hogan.js，使用cons.jade来使用jade等。使用console.log(cons)来获取完整的标识符列表。" - Amol M Kulkarni

Answer 1

1. 在你的package.json中添加两个引擎和consolidate.js。

2. 在yourapp.js中：

   var engines = require('consolidate');

   app.engine('jade', engines.jade);

   app.engine('handlebars', engines.handlebars);

更多信息请参见here。

- Sergii

---

是否可以添加自定义模板引擎？http://expressjs.com/advanced/developing-template-engines.html - Ben Orozco

这对我似乎没有起作用。Express 4似乎总是使用相同的引擎呈现所有文件，即使文件扩展名匹配不同的引擎。 - Wayne Bloss

@WayneBloss 听起来你的代码中可能隐藏着一个默认模板引擎。如果你是通过生成应用程序或从模板/遵循指南等方式开始的，那么你的应用程序很可能在某个地方指定了默认渲染。 - Ty_

那么你如何实现视图并精确地呈现它们...这是我在SO上的问题http://stackoverflow.com/questions/36394662/using-jade-and-handlebars-together-and-rendering-accordingly - Lion789

如果这段代码曾经工作过，现在它已经不再工作了。如果您没有使用 app.set('view engine', ...) 指定引擎，则应用程序将崩溃。如果您指定了一个引擎，则另一个引擎将被忽略。 - Chris

Answer 2

Express 4.0及以上版本的解决方案（直到再次更改）

1. NPM安装您所需的引擎。

// some examples
npm install ejs
npm install pug
npm install handlebars

在你的app.js文件中设置要使用的引擎。

app.set('view engine', 'pug');
app.set('view engine', 'ejs');

渲染您的模板时，请确保设置文件扩展名。

// forces usage of the respective render engine by setting the file extension explicitly.
res.render( 'about.ejs', { title: 'About' } );
res.render( 'about.pug', { title: 'About' } );

有关更多使用示例的文档。

• https://expressjs.com/zh-cn/guide/using-template-engines.html

- azariah

Answer 3

编辑

在与Amol M Kulkarni讨论了下面的评论后，我回来重新分析了这些内容。

结果证明，这比我想象的要容易得多，我必须回到这里分享我的解决方案。使用整合，可以像这样完成：

首先执行require操作。

var engines = require('consolidate');

然后你可以删除或设置引擎和视图引擎...
我尝试过删除所有的app.engine和app.set('view engine', '...');，它确实起作用了。但是，将其设置为除'html'以外的其他值只适用于一个引擎。所以我只需设置它以确保正确性。
我是这样设置的:

app.engine('html', engines.swig); // take note, using 'html', not 'ejs' or 'pug'..
app.set('view engine', 'html'); // also 'html' here.

稍后当您执行app.render时，请确保它具有文件扩展名，这样它就可以正常工作。

res.render( 'theme.ejs', {}); // will render with ejs
res.render( 'theme.pug', {}); // will render with pug

请确保已安装这些引擎（pug、ejs等），consolidate 将会处理其余部分。

---

旧回答.
关于 @Sergii 的回答，它对我来说并不完全有效。有时我在使用的模板中会出现错误。但错误信息是错误的，提示无法在目录中查找此模板。

我尝试了 @azariah 的解决方案，但仍然没有用。

app.set('view engine', 'pug'); // does not make sense.
app.set('view engine', 'ejs'); // overriding the last .set()

我发现使用consolodate.js非常有效。
像往常一样，添加app.set('view engine', 'pug');。
然后，在每次调用render时，都要设置'view engine'。

就像这样：

req.app.set('view engine', 'ejs');
res.render( 'theme', theme );

我担心的是，当有更多不同引擎的同时用户访问页面时，是否会发生冲突并出现我遇到的错误查找。

但我猜测，渲染速度非常快，另一个req.app.set调用时应该已经完成了。

- Reigel Gallarde

---

我正在使用它...只是你只能使用一个，例如pug，app.set('view engine', 'pug'); 这就是你的视图引擎... - Reigel Gallarde

正如我之前所提到的，调用两次app.set是没有意义的。你只会在最后一次调用时设置视图引擎... - Reigel Gallarde

我在谈论@Sergii的答案（不要误认为是azariah的）。您可以从consolidate.js 文档的注释中检查此内容。对于hogan.js，请使用cons.hogan，对于jade，请使用cons.jade等。使用console.log(cons)获取完整的标识符列表。 - Amol M Kulkarni

Answer 4

我认为这种做法更准确，也是我的个人实践。 我们应该设置一个默认的模板引擎，以便所有视图都至少经过一个模板引擎处理，这样可以避免文件暴露给最终用户，尤其是当你将HTML作为默认引擎时。

因此，首先要安装consolidate.js到目录中。

npm install consolidate

稍后，我们需要将安装的模块添加到应用程序文件中。

var consoengines = require('consolidate');

现在设置默认的视图引擎，选择pug是因为它很受欢迎。

app.set('view engine', 'pug');

在设置默认模板引擎之后，现在我需要安装额外的模板引擎。对于我的情况，我大多数时候需要使用EJS，因为它几乎允许所有的Javascript，在模板中制作任何东西都很方便。但你可以选择任何模板引擎。 你所需要做的就是安装你的模板引擎。

npm install ejs

现在将其添加到合并实例中，然后放回主模板引擎列表。

app.engine('ejs', engines.ejs);

每次渲染模板时，如果您在路由器中没有指定扩展名，则会使用默认的模板引擎（这里是PUG）进行调用。否则，它将根据路由器调用中提到的扩展名调用相应的模板引擎。

- M.M.B. Dhillon