尝试使用玉渲染 html 文件,但仍将其视为玉
Posted
技术标签:
【中文标题】尝试使用玉渲染 html 文件,但仍将其视为玉【英文标题】:trying to render html files using jade but it still adresses it as a jade 【发布时间】:2013-08-15 03:42:01 【问题描述】:我已经阅读了这两篇文章来重新评估我的问题:
http://***.com/questions/4529586/render-basic-html-view-in-node-js-express
http://***.com/questions/12046421/how-to-configure-express-js-jade-to-process-html-files
我的代码如下:
app.engine('.html', require('jade').__express);
app.set('views', __dirname + '/app/views');
app.set('view engine', 'html');
很明显,由于某种原因,它试图读取索引,就好像它仍然是一个玉文件一样,因此我得到了错误。我相信我将其正确配置为服务器 .html 文件。这里有什么问题?我迷路了……
我已经尝试重新排序,但仍然是同样的错误。
但由于某种原因,我收到此错误:
Error: ....\views\index.html:4
2| <html lang="en" ng-app="squashApp">
3| <head>
> 4| <meta charset="utf-8">
5| <title>Squash Organizer</title>
6| <link rel="stylesheet" href="css/app.css"/>
7| <link rel="stylesheet" href="css/bootstrap.css"/>
unexpected token "indent"
at Object.Parser.parseExpr (C:\Users\workspace\squash\node_modules\jade\lib\parser.js:241:15)
at Object.Parser.parse (C:\Users\workspace\squash\node_modules\jade\lib\parser.js:133:25)
at parse (C:\Users\workspace\squash\node_modules\jade\lib\jade.js:93:62)
at Object.exports.compile (C:\Users\workspace\squash\node_modules\jade\lib\jade.js:156:9)
at Object.exports.render (C:\Users\workspace\squash\node_modules\jade\lib\jade.js:210:15)
at Object.exports.renderFile (C:\Users\workspace\squash\node_modules\jade\lib\jade.js:247:18)
at View.exports.renderFile [as engine] (C:\Users\workspace\squash\node_modules\jade\lib\jade.js:232:21)
at View.render (C:\Users\workspace\squash\node_modules\express\lib\view.js:76:8)
at Function.app.render (C:\Users\workspace\squash\node_modules\express\lib\application.js:505:10)
at ServerResponse.res.render (C:\Users\workspace\squash\node_modules\express\lib\response.js:756:7)
谢谢。
【问题讨论】:
如果您不想使用jade,您是否尝试过仅删除app.engine('.html', require('jade').__express);
行?
你为什么要渲染 .html 文件?它应该是静态的而不是动态的。使用express.static
或按原样发送文件。
【参考方案1】:
用这一行:
app.engine('.html', require('jade').__express);
您告诉 express 使用jade 渲染以.html
结尾的模板。
有了这个:
app.set('view engine', 'html');
您告诉 express 它应该将不带扩展名的模板名称解释为以 html
结尾的名称。
所以我猜你正在尝试渲染'index'
,express 将其解释为index.html
,然后按照指示传递给jade。
最好将玉映射到它自己的扩展(.jade
是一个明显的候选者)。并使用其全名呈现您的index.html
。
将consolidate.js 添加到您的项目中:
var engines = require('consolidate');
告诉玉渲染以.jade
结尾的东西。
app.engine('jade', require('jade').__express);
为以.html
结尾的内容注册简单的html渲染器:
app.engine('html', function(str, options)
return function(locals)
return str;
;
);
告诉 express 将没有扩展名的模板渲染为翡翠:
app.set('view engine', 'jade');
使用它来呈现您的索引:
res.render('index.html');
还有这个:
res.render('view-name-without-extension');
渲染翡翠模板。
【讨论】:
我真的不明白我该怎么做。你能进一步解释一下吗? 你必须运行“npm install Consolidate”。我的结果编辑,测试../* further up */ var engines = require('consolidate'); /* then later */ app.engine('jade', require('jade').__express); app.engine('html', function(str, options) return function(locals) return str; ; ); app.set('view engine', 'jade'); app.use(express.static(path.join(__dirname, 'public')));
【参考方案2】:
默认 express 采用 Jade 模板引擎。您的 app.js 应如下所示。
/**
* Module dependencies.
*/
var express = require('express')
, routes = require('./routes')
, user = require('./routes/user')
, http = require('http')
, path = require('path');
var app = express();
// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade'); // <<<---- CHANGES FROM EJS TO JADE !!!
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
// development only
if ('development' == app.get('env'))
app.use(express.errorHandler());
app.get('/', routes.index);
app.get('/users', user.list);
http.createServer(app).listen(app.get('port'), function()
console.log('Express server listening on port ' + app.get('port'));
);
【讨论】:
这里唯一不同的是从 ejs 切换到 Jade,对吗?以上是关于尝试使用玉渲染 html 文件,但仍将其视为玉的主要内容,如果未能解决你的问题,请参考以下文章