node.js - 怎样在nodejs渲染模板时，根据页面的不同动态加载静态资源？

Question

所有的页面有个公共首尾header.ejs footer.ejs
每个页面都会加载公共头尾，而根据页面不同还会加载不同的css和js，该怎么做才能优雅做到这种既有公共头尾，又能加载不同的静态文件的效果？
能不能把这些加载静态资源都统一放在同一个配置文件里(见过有人这么做，不过忘了是怎么实现的了)，比如叫entry，而不用每个页面都去单独指定加载了什么

Answer 1

谢邀吧。我本人是非常不喜欢ejs的(太丑了)，我只能谈谈做这事的基本思路：

首先因为“页面不同”，那势必在res.render(view [, locals] [, callback])的locals对象里有一个专门字段用来表示页面类型的，这个可以理解吧？譬如：{ pageType: 'home' }。否则所有的渲染都是通过公共的header、footer，该如何区分？

其次，就是在header.ejs或者footer.ejs里根据新增页面类型的字段来配置静态资源，譬如：

<% if(locals.pageType === 'home') { %>
    <link rel="stylesheet" href="xxx/home.css" />
<%} else if (locals.pageType === 'about') { %>
    <link rel="stylesheet" href="mmmx/about.css" />
<% } %>

当然ejs这么写你可能觉得太累，那是不是可以在js写个映射？当然可以，譬如：

var mapping = {
    home: 'xxx/home.css',
    about: 'mmmx/about.css'
};

在渲染时直接给locals对象里注入一个resource字段，类似：

res.render(view, {
    resource: mapping[pageType]
});

这样ejs就可以改写成：

<link rel="stylesheet" href="<%= locals.resource %>" />