我有一个基本的Node.js应用程序,我试图使用Express框架启动。我有一个views文件夹,其中有一个index.html文件。但是我在加载网页时收到以下错误:
Error: Cannot find module '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')
我错过了什么?
我想允许对“/”的请求由Express路由处理,而以前它们是由静态中间件处理的。这将允许我渲染index.html的常规版本或加载连接+最小化JS和CSS的版本,这取决于应用程序设置。受到Andrew Homeyer回答的启发,我决定将我的HTML文件(未修改)拖到views文件夹中,并像这样配置Express
app.engine('html', swig.renderFile);
app.set('view engine', 'html');
app.set('views', __dirname + '/views');
创建了一个这样的路由处理器
app.route('/')
.get(function(req, res){
if(config.useConcatendatedFiles){
return res.render('index-dist');
}
res.render('index');
});
结果很好。
对于我的项目,我创建了这样的结构:
index.js
css/
reset.css
html/
index.html
这段代码为/请求服务index.html,为/css/reset.css请求服务reset.css。很简单,最好的部分是它自动添加缓存头。
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);
我试图用一个RESTful API创建一个angular应用,并多次登陆这个页面,尽管它并没有什么帮助。以下是我发现有效的方法:
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的回调中,路由看起来像: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服务器!
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}!
`);
});
来自Express.js指南:视图渲染
视图文件名采用Express形式。ENGINE,其中ENGINE是所需模块的名称。例如视图布局。Ejs会告诉视图系统require(' Ejs '),被加载的模块必须导出方法exports。render(str, options)来遵守Express,但是app.register()可以用来将引擎映射到文件扩展名,因此,例如foo.html可以由jade渲染。
所以你要么创建自己的简单渲染器,要么使用jade:
app.register('.html', require('jade'));
更多关于app.register的信息。
注意,在Express 3中,这个方法被重命名为app.engine
如果你使用express@~3.0.0修改下面的代码行:
app.use(express.staticProvider(__dirname + '/public'));
就像这样:
app.set("view options", {layout: false});
app.use(express.static(__dirname + '/public'));
我做了它的描述在express api页面,它的工作就像魅力。有了这样的设置,你就不需要编写额外的代码,所以它很容易用于你的微产品或测试。
完整代码如下所示:
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')