有没有一种使用 EJS 模板避免重复使用 Express 服务器的路由的好方法？

Question

假设我的应用有两个视图：index.ejs、profile/index.ejs 我想使用如下所示的快速代码进行路由。

/* GET home page. */
router.get('/', function (req, res, next) {
    res.render('index');
});

/* GET profile page. */
router.get('/profile', function (req, res, next) {
    res.render('profile/index');
});

两个ejs文件都应该有bootstrap link吗?

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">

如果是，那么每当我想渲染另一个页面时，我是否应该从CDN重新加载样式和js文件？

我的意思是，当我更改我的 EJS 模板时，有什么好的方法可以保留通用内容吗？

Answer 1

没有。您可以通过将用于整个应用程序的脚本和 css 添加到不同的 EJS 文件中来轻松做到这一点。

例如

创建名为 header.ejs 的文件并在其中添加所有链接和脚本。

然后在您的模板中只包含此文件和这段代码

<head>
   <% include header.ejs %>
   //IN HERE you can add page specific scripts or links
</head>

希望对您有所帮助

Answer 2

有几种方法可以实现这一点。

1).使用部分并将它们包含在每个页面中。

2).如果您不喜欢在每个页面中包含部分内容，那么您可以使用 express-ejs-layouts or ejs-locals

对于第一种方法，我们可以有一个包含我们需要的所有部分的部分目录。

这是我们的偏音

//partials/head.ejs
<meta charset="UTF-8">
<title>EJS Template</title>
<link ref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

此 scipt.js 可以包含您要包含的所有脚本。

//partials/script.js   

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">      </script>

假设我们想在 index.ejs 中包含这些部分，那么我们需要做的就是简单地使用 <% include partial %> 就可以了。

 // index.ejs
    <!DOCTYPE html>
    <html lang="en">
      <head>
        <% include partials/head %>
      </head>
      <body class="container">

        <header>
          <% include partials/header %>
        </header>

        <main>
          <div class="jumbotron">
            <h1>This is great</h1>
            <p>Welcome to templating using EJS</p>
          </div>
        </main>

        <footer>
           <% include partials/footer %>
        </footer>
        <% include partials/script %>
      </body>
    </html>

希望对您有所帮助！！

有没有一种使用 EJS 模板避免重复使用 Express 服务器的路由的好方法？

Is there a nice way to route using EJS teamplate avoiding repetition with Express server?

javascript

ejs

node.js

express

twitter-bootstrap