Html NodeJS和Express:CSS未加载

Html NodeJS和Express:CSS未加载,html,css,node.js,Html,Css,Node.js,我已经创建了自己的服务器和路由器文件来服务我的html页面。页面呈现,但我的问题是,它呈现时没有css样式 我正在使用express.static为我的/公共文件提供服务,理论上应该为css文件提供服务——至少我是这么认为的。我已经在谷歌上搜索了我的问题,并查看了前几页的链接,但我仍然无法解决我的问题。有人能嘲笑我的错误吗 我的目录是: NODEJS 节点单元 公开的 css style.css js 路由器 main.js 观点 我的html文件 我的服务器代码是:

我已经创建了自己的服务器和路由器文件来服务我的html页面。页面呈现,但我的问题是,它呈现时没有css样式

我正在使用express.static为我的/公共文件提供服务,理论上应该为css文件提供服务——至少我是这么认为的。我已经在谷歌上搜索了我的问题,并查看了前几页的链接,但我仍然无法解决我的问题。有人能嘲笑我的错误吗

我的目录是:

  • NODEJS
    • 节点单元
    • 公开的
      • css
        • style.css
      • js
    • 路由器
      • main.js
    • 观点
      • 我的html文件

我的服务器代码是:

var express = require('express');
var app = express();
var fs = require('fs');
var url = require('url');
var path = require('path');
var http = require('http');
var router = express.Router();

var bodyParser = require('body-parser');
app.use(bodyParser());

app.use(express.static(__dirname + "/public", {maxAge: 3456700000})); 
require('./router/main')(app);   
app.engine('html', require('ejs').renderFile);
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');

var server = app.listen(3000, function () {

  var host = server.address().address
  var port = server.address().port

  console.log('Example app listening at http://%s:%s', host, port);

});
var url = require('url');

module.exports = function (app) {

    app.get('/', function (req, res) {
        res.render('../views/default.html');
        console.log("Home page displayed");
    });

// Some more get requests for different pages

};
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>Index</title>
<link rel="stylesheet" type="text/css"  href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/css/style.css">       
</head> 

我的路由器代码是:

var express = require('express');
var app = express();
var fs = require('fs');
var url = require('url');
var path = require('path');
var http = require('http');
var router = express.Router();

var bodyParser = require('body-parser');
app.use(bodyParser());

app.use(express.static(__dirname + "/public", {maxAge: 3456700000})); 
require('./router/main')(app);   
app.engine('html', require('ejs').renderFile);
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');

var server = app.listen(3000, function () {

  var host = server.address().address
  var port = server.address().port

  console.log('Example app listening at http://%s:%s', host, port);

});
var url = require('url');

module.exports = function (app) {

    app.get('/', function (req, res) {
        res.render('../views/default.html');
        console.log("Home page displayed");
    });

// Some more get requests for different pages

};
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>Index</title>
<link rel="stylesheet" type="text/css"  href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/css/style.css">       
</head> 

我的html代码是:

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>Index</title>
<link rel="stylesheet" type="text/css"  href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/css/style.css">       
</head> 

指数

[错误已修复:代码需要重新排列,chrome浏览器需要更新到最新版本]

css路径看起来错误,应该是
/css/style.css
,而不是
portalstyle.css
,如下所示

<link rel="stylesheet" type="text/css" href="/css/style.css">       


感谢您的快速回复。我没有注意到这一点,但现在已经改变了它,我仍然有同样的问题-代码也更新了,包括这个OK,它仍然是
portalstyle.css
而不是
style.css
,你能告诉我你得到的css请求(404或其他什么)有什么错误吗。而且express日志中是否存在任何错误。使用morgan module for express或其他工具打印您的请求日志在其他路由之前显示静态路由(在bodyParser之后)@adeneo谢谢您的回复。我现在已经更改了这个,但仍然无法正确显示。您将它移到
/router/main
行上方了吗?@adeneo表示歉意。我只是重新创建了整个项目,正如你所展示的那样,对我来说效果很好