呈现基本的HTML视图？
我有一个基本的node.js应用程序，我试图使用Express框架来实现。 我有一个views文件夹，我有一个index.html文件。 但是在加载Web浏览器时收到以下错误。
错误：找不到模块'html'
以下是我的代码。
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')
我在这里错过了什么？
你可以让玉包含一个简单的HTML页面：
在views / index.jade中
include plain.html
在views / plain.html中
<!DOCTYPE html> ...
app.js仍然可以渲染玉：
res.render(index)
这些答案中的很多都过时了。
使用Express 3.0.0和3.1.0，以下工作：
app.set('views', __dirname + '/views'); app.engine('html', require('ejs').renderFile);
请参阅下面的注释，以获取有关快捷3.4+的替代语法和注意事项：
app.set('view engine', 'ejs');
然后你可以做一些事情：
app.get('/about', function (req, res) { res.render('about.html'); });
这假定你在views子文件夹中有你的views ，并且你已经安装了ejs节点模块。 如果没有，请在节点控制台上运行以下命令：
npm install ejs --save
从Express.js指南： 查看渲染
查看文件名的格式为
Express.ENGINE，其中ENGINE是将要求的模块的名称。 例如，视图layout.ejs将告诉视图系统require('ejs')，被加载的模块必须导出方法exports.render(str, options)以符合Express，但可以使用app.register()将引擎映射到文件扩展名，以便例如foo.html可以由jade渲染。
所以要么你创build你自己的简单的渲染器，或者你只是使用玉：
app.register('.html', require('jade'));
关于app.register 更多信息
请注意，在Express 3中，此方法被重命名为
app.engine
尝试这个。 它适用于我。
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"); });
你也可以读取html文件并发送。
app.get('/', function(req, res) { fs.readFile(__dirname + '/public/index.html', 'utf8', function(err, text){ res.send(text); }); });
如果您使用的是express@~3.0.0 ，请从您的示例中更改下面的行：
app.use(express.staticProvider(__dirname + '/public'));
像这样的东西：
app.set("view options", {layout: false}); app.use(express.static(__dirname + '/public'));
我在express api页面上描述了它，它的function就像魅力一样。 使用该设置，您不必编写额外的代码，因此它可以很容易地用于微型生产或testing。
完整代码如下：
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')
app.get('/', function (req, res) { res.sendfile(__dirname + '/public/index.html'); });
我也面对同样的问题express 3.X和node 0.6.16 。 上述给出的解决scheme将不适用于最新版本的express 3.x 他们删除了app.register方法并添加了app.engine方法。 如果您尝试了上述解决scheme，则最终可能会出现以下错误。
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)
摆脱错误信息。 app.configure function下行添加到您的app.configure function
app.engine('html', require('ejs').renderFile);
注意：你必须安装ejs模板引擎
npm install -g ejs
例：
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"); });
注意：最简单的解决scheme是使用ejs模板作为视图引擎。 在那里你可以在* .ejs视图文件中编写原始的HTML。
如果您不必使用视图目录，只需将html文件移动到下面的公共目录即可。
然后，将此行添加到app.configure而不是“/ views”。
server.use（express.static（__ dirname +'/ public'））;
对于我的项目，我创build了这个结构：
index.js css/ reset.css html/ index.html
此代码为/请求提供index.html，为/css/reset.css请求提供/css/reset.css 。 很简单， 最好的部分是它自动添加caching标题 。
var express = require('express'), server = express(); server.configure(function () { server.use('/css', express.static(__dirname + '/css')); server.use(express.static(__dirname + '/html')); }); server.listen(1337);
使用Express 4.0.0，您唯一需要做的就是在app.js中注释掉两行：
/* app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'jade'); */ //or whatever the templating engine is.
然后把你的静态文件放到/ public目录下。 例如：/public/index.html
我在2线以下添加，它为我工作
app.set('view engine', 'html'); app.engine('html', require('ejs').renderFile);
要在节点中呈现Html页面，请尝试以下操作，
app.set('views', __dirname + '/views'); app.engine('html', require('ejs').renderFile);
-
你需要通过
npm安装ejs模块，如：npm install ejs --save
1）最好的办法是设置静态文件夹。 在你的主文件（app.js | server.js | ???）中：
app.use(express.static(path.join(__dirname, 'public')));
公共/ CSS / form.html
公共/ CSS / style.css中
然后你从“公共”文件夹中获得静态文件：
http://YOUR_DOMAIN/form.html http://YOUR_DOMAIN/css/style.css
2）
您可以创build您的文件caching。
使用方法fs.readFileSync
var cache = {}; cache["index.html"] = fs.readFileSync( __dirname + '/public/form.html'); app.get('/', function(req, res){ res.setHeader('Content-Type', 'text/html'); res.send( cache["index.html"] ); };);
我试图用一个快速的RESTful API设置一个angular度的应用程序，并且多次登陆这个页面，尽pipe它没有帮助。 这是我发现的工作：
app.configure(function() { app.use(express.static(__dirname + '/public')); // set the static files location app.use(express.logger('dev')); // log every request to the console app.use(express.bodyParser()); // pull information from html in POST app.use(express.methodOverride()); // simulate DELETE and PUT app.use(express.favicon(__dirname + '/public/img/favicon.ico')); });
然后在你的API路线的callback看起来像： res.jsonp(users);
你的客户端框架可以处理路由。 Express是用于提供API的。
我的家乡路线如下所示：
app.get('/*', function(req, res) { res.sendfile('./public/index.html'); // load the single view file (angular will handle the page changes on the front-end) });
在Express路由中尝试res.sendFile（）函数。
var express = require("express"); var app = express(); var path = require("path"); app.get('/',function(req,res){ res.sendFile(path.join(__dirname+'/index.html')); //__dirname : It will resolve to your project folder. }); app.get('/about',function(req,res){ res.sendFile(path.join(__dirname+'/about.html')); }); app.get('/sitemap',function(req,res){ res.sendFile(path.join(__dirname+'/sitemap.html')); }); app.listen(3000); console.log("Running at Port 3000");
在这里阅读： http : //codeforgeek.com/2015/01/render-html-file-expressjs/
res.sendFile(__dirname + '/public/login.html');
我不想依靠ejs来传递一个HTML文件，所以我简单地写了一个小的渲染器：
const Promise = require( "bluebird" ); const fs = Promise.promisifyAll( require( "fs" ) ); app.set( "view engine", "html" ); app.engine( ".html", ( filename, request, done ) => { fs.readFileAsync( filename, "utf-8" ) .then( html => done( null, html ) ) .catch( done ); } );
这是一个快速服务器的完整文件演示！
https://gist.github.com/xgqfrms-GitHub/7697d5975bdffe8d474ac19ef906e906
希望它会帮助你！
// simple express server for HTML pages! // ES6 style const express = require('express'); const fs = require('fs'); const hostname = '127.0.0.1'; const port = 3000; const app = express(); let cache = [];// Array is OK! cache[0] = fs.readFileSync( __dirname + '/index.html'); cache[1] = fs.readFileSync( __dirname + '/views/testview.html'); app.get('/', (req, res) => { res.setHeader('Content-Type', 'text/html'); res.send( cache[0] ); }); app.get('/test', (req, res) => { res.setHeader('Content-Type', 'text/html'); res.send( cache[1] ); }); app.listen(port, () => { console.log(` Server is running at http://${hostname}:${port}/ Server hostname ${hostname} is listening on port ${port}! `); });
文件夹结构：
. ├── index.html ├── node_modules │ ├──{...} └── server.js
server.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
<!DOCTYPE html> <html> <body> <div> hello world </div> </body> </html>
输出：
你好，世界
将以下行添加到您的代码
-
在package.json文件中将“jade”replace为“ejs”和“XYZ”（版本）replace为“*”
"dependencies": { "ejs": "*" } -
然后在你的app.js文件中添加下面的代码：
app.engine('html', require('ejs').renderFile);app.set('view engine', 'html'); -
并记住在视图文件夹中保留所有.HTML文件
干杯:)
我希望允许“/”的请求由Express路由处理，之前他们已经由静态中间件处理过。 这将允许我呈现index.html的常规版本，或根据应用程序设置加载连接的+缩小的JS和CSS的版本。 受到Andrew Homeyer的回答的启发，我决定将我的HTML文件（未经修改）拖入视图文件夹，像这样configurationExpress
app.engine('html', swig.renderFile); app.set('view engine', 'html'); app.set('views', __dirname + '/views');
并创build了一个如此的路由处理程序
app.route('/') .get(function(req, res){ if(config.useConcatendatedFiles){ return res.render('index-dist'); } res.render('index'); });
这工作得很好。
在server.js中，请包括
var express = require("express"); var app = express(); var path = require("path"); app.get('/',function(req,res){ res.sendFile(path.join(__dirname+'/index.html')); //__dirname : It will resolve to your project folder. });
我通常使用这个
app.configure(function() { app.use(express.static(__dirname + '/web')); });
只是要小心，因为它将共享/ web目录中的任何东西。
我希望它有帮助
如果您使用express框架到node.js
安装npm ejs
然后添加configuration文件
app.set('port', process.env.PORT || 3000); app.set('views', __dirname + '/views'); app.set('view engine', 'ejs'); app.set('view engine', 'jade'); app.use(express.favicon()); app.use(express.logger('dev')); app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(app.router)
;
渲染从导出页面的页面form.js在视图dir中具有html文件，扩展名为ejs文件名为form.html.ejs
然后创buildform.js
res.render('form.html.ejs');
// @错误：找不到模块'html'
// ..文件是在别的地方！
console.log('Current uri: ' + uri); // u are lookin for this file console.log('Current directory: ' + process.cwd()); //!!!>>> Current directory: c:\Program Files\nodejs\node_modules // put into working dir console.log('Starting directory: ' + process.cwd()); try { process.chdir('c:\\3W\\JavaScript\\node.js\\x4node\\sampleDir'); console.log('New directory: ' + process.cwd()); //!!!>>> New directory: c:\3W\JavaScript\node.js\x4node\sampleDir } catch (err) { console.log('chdir: ' + err); } // try this to see where u are! // (process.cwd@http://nodejs.org/docs/latest/api/index.html)
