包含HTML块使用node.js
这是我想要的，但可能不能有：
使用node.js和express或者ejs，我想在我的客户端目录中编写一个普通的HTML文件时，server-side-include包含一个HTML模板块。 如果我可以将variables传入HTML文档的include，那也很酷。
Sooo的东西是这样的：
<!doctype html> <html> <head> <%include head, ({title: "Main Page"}) %> </head> <body> <% include header, ({pageName: "Home", color: "red"}) %> ... <<% include footer%>> </body> </html> 在节点世界里有没有这样的作品？ 或者任何接近并可能适合这种function的东西？ 我不会完全按照这里指出的方式使用它，但这是我正在寻找的function。
我已经看了玉，车把，烬和ejs，和ejs似乎是最接近的。 也许其中之一已经这样做了，但我只是困惑实施。
任何build议将是伟大的！
好，我知道了…
server.js
var express = require('express'); var server = express(); var ejs = require('ejs'); ejs.open = '{{'; ejs.close = '}}'; var oneDay = 86400000; server.use(express.compress()); server.configure(function(){ server.set("view options", {layout: false}); server.engine('html', require('ejs').renderFile); server.use(server.router); server.set('view engine', 'html'); server.set('views', __dirname + "/www"); }); server.all("*", function(req, res, next) { var request = req.params[0]; if((request.substr(0, 1) === "/")&&(request.substr(request.length - 4) === "html")) { request = request.substr(1); res.render(request); } else { next(); } }); server.use(express.static(__dirname + '/www', { maxAge: oneDay })); server.listen(process.env.PORT || 8080);
并在/ www我有以下的.html文件：
的index.html
{{include head.html}} {{include header.html}} <p class="well">Hello world!</p> {{include footer.html}}
head.html
<!DOCTYPE html> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title></title> <meta name="description" content=""> <meta name="viewport" content="width=device-width"> {{include include.css.html}} <script src="js/vendor/modernizr-2.6.2.min.js"></script> </head> <body>
include_css.html
<link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/bootstrap.css"> <link rel="stylesheet" href="css/bootstrap-responsive.css"> <link rel="stylesheet" href="css/main.css">
了header.html
<div class="well"> <h1>HEADER</h1> </div>
footer.html
<div class="well"> <h1>FOOTER</h1> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script> <script src="js/plugins.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/main.js"></script> <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. --> <script> var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0]; g.src='//www.google-analytics.com/ga.js'; s.parentNode.insertBefore(g,s)}(document,'script')); </script> </body> </html>
这一切都经过，甚至包括在内容和静态内容。 这一切都在HTML文件上执行，并在一个上下文，感觉像香草networking创作。
++++糟糕+++++好吧，我几乎所有的。 我忘了我也想把variables传递给模板中的include。 我还没有尝试过…任何想法？
++++更新+++++
好的，我明白了。
这个讨论明确表示，我想我对ejs的工作方式还不够了解。
我已经改变了index.html从variables声明开始：
{{ var pageTitle = 'Project Page'; var projectName = 'Project Title'; }}
然后你可以从包含内部调用这些variables，不pipe它们嵌套得有多深。
因此，例如，index.html包含start.html，其中包含header.html。 在头文件.html中，我可以在头文件中调用{{= projectName}}，即使它是在index.html中声明的。
我把整个事情放在github上 。
我会推荐nunjucks或pejs 。 nunjucks是忍者的灵感，而pejs只是ejs +inheritance，封锁和文件支持。
pejs目前有一些空间问题，但仍然非常有用。 在这两个，我更喜欢与nunjucks的分离层。
Jade非常酷，并且具有你正在寻找的function集，但它有一个非常独特的语法。 玉的参考： 模板inheritance ， 块 ， 包括
保持简单，使用templatesjs
这可以使用templatesjs轻松完成
html文件[index.html] ：
<head> <title> <%title%> </tile> </head> <body> <%include header.html%> ........ <%include footer.html%> </body> </html>
现在在node.js文件中 ：
var tjs = require("templatesjs") fs.readFile("./index.html", function(err,data){ // provided the file above is ./ index.html if(err) throw err; tjs.set(data); // invoke it tjs.render("title", "home");//render the page title });
你完成了。 templatesjs会自动包含header.html和footer.html所有你需要做的就是呈现页面标题。
可以在这里find一个很好的帮助
- 安装 ：
$ npm install templatesjs
希望这可以帮助
那么我可以build议最简单的方法。
使用templatesjs将是最简单的select，这是一个新的模块，使这样的事情变得如此简单
假设我们想要在index.html中包含header.html
HTML
<body> <%include header.html%> </body>
的node.js
var temp = require('templatesjs'); fs.readFile("./index/html), function(err,data){ if(err) throw err; var output = temp.set(data); res.end(output); });
找不到比这更容易的东西。 安装templatesjs
$ npm install templatesjs
Jade确实允许服务器端包含HTML块，任何局部域范围的variables都会传递给包含的玉模板。 但是如果你想这样做的话，这两个文件都必须是jade语法格式，而不是原始的HTML格式。
你想传递的任何variables都可以添加到本地对象中。