Javascript 呈现基本的 HTML 视图？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4529586/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Render basic HTML view?
提问by aherrick
I have a basic node.js app that I am trying to get off the ground using Express framework. I have a viewsfolder where I have an index.htmlfile. But I receive the following error when loading the web browser.
我有一个基本的 node.js 应用程序，我正在尝试使用 Express 框架启动它。我有一个views文件夹，里面有一个index.html文件。但是我在加载 Web 浏览器时收到以下错误。
Error: Cannot find module 'html'
错误：找不到模块“html”
Below is my code.
下面是我的代码。
var express = require('express');
var app = express.createServer();
app.use(express.staticProvider(__dirname + '/public'));
app.get('/', function(req, res) {
res.render('index.html');
});
app.listen(8080, '127.0.0.1')
What am I missing here?
我在这里缺少什么？
回答by Andrew Homeyer
You can have jade include a plain HTML page:
您可以让 jade 包含一个纯 HTML 页面：
in views/index.jade
在视图/index.jade
include plain.html
in views/plain.html
在视图/plain.html
<!DOCTYPE html>
...
and app.js can still just render jade:
而 app.js 仍然可以渲染 jade：
res.render(index)
回答by Drew Noakes
Many of these answers are out of date.
这些答案中有许多已经过时了。
Using express 3.0.0 and 3.1.0, the following works:
使用 express 3.0.0 和 3.1.0，以下工作：
app.set('views', __dirname + '/views');
app.engine('html', require('ejs').renderFile);
See the comments below for alternative syntax and caveats for express 3.4+:
有关 express 3.4+ 的替代语法和注意事项，请参阅下面的注释：
app.set('view engine', 'ejs');
Then you can do something like:
然后你可以做这样的事情：
app.get('/about', function (req, res)
{
res.render('about.html');
});
This assumes you have your views in the viewssubfolder, and that you have installed the ejsnode module. If not, run the following on a Node console:
这假设您在views子文件夹中有您的视图，并且您已经安装了ejs节点模块。如果没有，请在 Node 控制台上运行以下命令：
npm install ejs --save
回答by Ivo Wetzel
From the Express.js Guide: View Rendering
来自 Express.js 指南：视图渲染
View filenames take the form
Express.ENGINE, whereENGINEis the name of the module that will be required. For example the viewlayout.ejswill tell the view system torequire('ejs'), the module being loaded must export the methodexports.render(str, options)to comply with Express, howeverapp.register()can be used to map engines to file extensions, so that for examplefoo.htmlcan be rendered by jade.
视图文件名的格式为
Express.ENGINE，其中ENGINE是所需模块的名称。例如视图layout.ejs会告诉视图系统require('ejs')，被加载的模块必须导出方法exports.render(str, options)以符合Express，但app.register()可以用于将引擎映射到文件扩展名，以便例如foo.html可以通过jade进行渲染。
So either you create your own simple renderer or you just use jade:
因此，要么创建自己的简单渲染器，要么只使用 jade：
app.register('.html', require('jade'));
Moreabout app.register.
更多关于app.register.
Note that in Express 3, this method is renamed
app.engine
注意在 Express 3 中，这个方法被重命名了
app.engine
回答by keegan3d
You could also read the HTML file and send it:
您还可以阅读 HTML 文件并将其发送：
app.get('/', (req, res) => {
fs.readFile(__dirname + '/public/index.html', 'utf8', (err, text) => {
res.send(text);
});
});
回答by spectrum
try this. it works for me.
尝试这个。这个对我有用。
app.configure(function(){
.....
// disable layout
app.set("view options", {layout: false});
// make a custom html template
app.register('.html', {
compile: function(str, options){
return function(locals){
return str;
};
}
});
});
....
app.get('/', function(req, res){
res.render("index.html");
});
回答by nod
app.get('/', function (req, res) {
res.sendfile(__dirname + '/public/index.html');
});
回答by Mark Karwowski
If you're using express@~3.0.0change the line below from your example:
如果您使用express@~3.0.0，请更改示例中的以下行：
app.use(express.staticProvider(__dirname + '/public'));
to something like this:
像这样：
app.set("view options", {layout: false});
app.use(express.static(__dirname + '/public'));
I made it as described on express api pageand it works like charm. With that setup you don't have to write additional code so it becomes easy enough to use for your micro production or testing.
我按照express api 页面上的描述制作了它，它的作用就像魅力一样。通过这种设置，您不必编写额外的代码，因此它很容易用于您的微型生产或测试。
Full code listed below:
完整代码如下：
var express = require('express');
var app = express.createServer();
app.set("view options", {layout: false});
app.use(express.static(__dirname + '/public'));
app.get('/', function(req, res) {
res.render('index.html');
});
app.listen(8080, '127.0.0.1')
回答by Jak
I also faced the same issue in express 3.Xand node 0.6.16. The above given solution will not work for latest version express 3.x. They removed the app.registermethod and added app.enginemethod. If you tried the above solution you may end up with the following error.
我在express 3.X和 中也遇到了同样的问题node 0.6.16。上面给出的解决方案不适用于最新版本express 3.x。他们删除了app.register方法并添加了app.engine方法。如果您尝试了上述解决方案，最终可能会出现以下错误。
node.js:201
throw e; // process.nextTick error, or 'error' event on first tick
^
TypeError: Object function app(req, res){ app.handle(req, res); } has no method 'register'
at Function.<anonymous> (/home/user1/ArunKumar/firstExpress/app.js:37:5)
at Function.configure (/home/user1/ArunKumar/firstExpress/node_modules/express/lib/application.js:399:61)
at Object.<anonymous> (/home/user1/ArunKumar/firstExpress/app.js:22:5)
at Module._compile (module.js:441:26)
at Object..js (module.js:459:10)
at Module.load (module.js:348:31)
at Function._load (module.js:308:12)
at Array.0 (module.js:479:10)
at EventEmitter._tickCallback (node.js:192:40)
To get rid of the error message. Add the following line to your app.configure function
摆脱错误信息。将以下行添加到您的app.configure function
app.engine('html', require('ejs').renderFile);
Note: you have to install ejstemplate engine
注意：你必须安装ejs模板引擎
npm install -g ejs
Example:
例子：
app.configure(function(){
.....
// disable layout
app.set("view options", {layout: false});
app.engine('html', require('ejs').renderFile);
....
app.get('/', function(req, res){
res.render("index.html");
});
Note:The simplest solution is to use ejs template as view engine. There you can write raw HTML in *.ejs view files.
注意：最简单的解决方案是使用 ejs 模板作为视图引擎。在那里您可以在 *.ejs 视图文件中编写原始 HTML。
回答by KARTHIKEYAN.A
folder structure:
文件夹结构：
.
├── index.html
├── node_modules
│?? ├──{...}
└── server.js
server.js
服务器.js
var express = require('express');
var app = express();
app.use(express.static('./'));
app.get('/', function(req, res) {
res.render('index.html');
});
app.listen(8882, '127.0.0.1')
index.html
索引.html
<!DOCTYPE html>
<html>
<body>
<div> hello world </div>
</body>
</html>
output:
输出：
hello world
你好，世界
回答by spectrum
If you don't have to use the viewsdirectory, Simply move html files to the publicdirectory below.
如果您不必使用views目录，只需将html文件移动到下面的公共目录即可。
and then, add this line into app.configure instead of '/views'.
然后，将此行添加到 app.configure 而不是“/views”。
server.use(express.static(__dirname + '/public'));
