Question

我创建了自己的服务器和路由器文件来为我的html页面提供服务。页面呈现，但我的问题是，它呈现没有CSS样式。

我正在使用express.static来提供我/公共文件，理论上它应该服务于css文件 - 或者我认为。我已经在Google上搜索了我的问题并查看了前几页的链接，但我仍无法解决我的问题。任何人都可以运动我的错误吗？

我的目录是：

的NodeJS
- node_modules
- 公共
  - 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

};

我的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浏览器需要更新到最新版本]

Answer 1

css路径看起来有误，应该是/css/style.css而不是portalstyle.css，就像这样

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

NodeJS和Express：CSS没有加载

1 个答案: