文件

Question

我正在尝试用Bliss替换Jade作为NodeJS上示例Express网站的模板引擎。这是app.js的内容：

var express = require('express'),
    routes = require('./routes'),
    http = require('http'),
    path = require('path'),
    Bliss = new require('bliss'),
    bliss = new Bliss({ext: '.jhtml'}),
    app = express();

app.configure(function(){
    app.set('port', process.env.PORT || 3000);
    app.set('views', __dirname + '/views');
    // app.set('view engine', 'bliss'); /* replaced with app.engine() call below */
    app.use(express.favicon(__dirname + '/public/img/favicon.ico'));
    app.use(express.logger('dev'));
    app.use(express.bodyParser());
    app.use(express.methodOverride());
    app.use(app.router);
    app.use(require('stylus').middleware(__dirname + '/public'));
    app.use(express.static(path.join(__dirname, 'public'))); });

app.configure('development', function(){
    app.use(express.errorHandler());
    app.locals.pretty = true; });

app.get('/', /* routes.index */ function(req, res){
    var index = bliss.compile('index');
    bliss.render(index); });

http.createServer(app).listen(app.get('port'), function(){
    console.log("Express server listening on port " + app.get('port')); });

我已尝试过其他SO问题的一些内容，但我对Node，Express或Bliss不太熟悉，无法调试为什么它会返回以下500错误：

500 TypeError: Object function anonymous() { var __out=[],write=__out.push.bind(__out),__tmp=0,render=this.render;write("index"); return __out.join(''); } has no method 'indexOf'

我非常确信模板和视图设置正确，因为它们非常简单，并且可以密切关注Bliss wiki。

这是由于Bliss与Express不完全兼容吗？是否有更好的方法将其设置为正常工作？

Answer 1

这是我如何解决问题

假设我的所有幸福文件都有.js.html扩展名

文件

<强> app.js

var Bliss = require('bliss');
var bliss = new Bliss();
app.set('views', __dirname + '/views/bliss');
app.set('view engine', 'js.html');
app.engine('js.html', function(path, options, fn){

   // res.render is calling this
   // update context here (available to all templates)
   var ctx = options.context;
   console.log("context", ctx);
   if (typeof ctx === 'undefined') {
      ctx = {};
   }

   // these will write over what's already in the context
   ctx.name2   = 'MEH2';
   //ctx.name1   = 'MEH1';
   //ctx.layout  = 'layout2';

   var output = bliss.render(path, ctx); 
   fn(null, output); // fn ==> function(error, str) 
});

路由器文件index.js

exports.index = function(req, res){

  console.log("ready to render index1.js.html");

  var ctx = {context : {name1 : 'mike1'}};
  ctx.context.layout = 'layout1';

  res.render('index1', ctx);
};

index1.js.html文件

@!(ctx)

@function title() {
   WOW @ctx.name1, @ctx.name2
}

@function body() {
<div>
   <h2> Hello @ctx.name1</h2>
</div>
}

@*choose the layout based on the context*@
@render(ctx.layout, body, title, ctx)

layout1.js.html

@!(body, title, ctx)

<!DOCTYPE html>
<html>
<head>
<title> @title() </title>
</head>
  <body>
  <h1> REALLY @ctx.title </h1>
  LAYOUT 1
  @body()
  </body>
</html>

layout2.js.html是相同的，除了LAYOUT 2作为其文本

现在使用app.js / app.engine函数观看如何在不同阶段影响上下文

评论：现在我得到了express.js和bliss的工作，我决定继续使用jade。我喜欢幸福＆＃39;语法，但除了花太多时间让幸福工作，我决定我还没准备好完全承诺：）

NodeJS / Express：使用Bliss作为模板引擎的错误

1 个答案:

文件