加载单独的css样式表(heroku nodejs)

加载单独的css样式表(heroku nodejs),css,node.js,heroku,Css,Node.js,Heroku,我无法在本地和heroku服务器上为heroku web应用加载单独的css样式表。我最近从google app engine迁移过来,我在那里加载样式表的方式非常好。我在这里做错了什么??任何帮助都将不胜感激!!这是我的密码: /app/server.js var express = require("express"); var app = express(); app.use(express.logger()); var fs = require("fs"); var buf = fs.

我无法在本地和heroku服务器上为heroku web应用加载单独的css样式表。我最近从google app engine迁移过来,我在那里加载样式表的方式非常好。我在这里做错了什么??任何帮助都将不胜感激!!这是我的密码:

/app/server.js

var express = require("express");
var app = express();
app.use(express.logger());

var fs = require("fs");
var buf = fs.readFileSync("html/index.html");
var index = buf.toString();

app.get('/', function(request, response) {
    response.send(index);
});

var port = process.env.PORT || 5000;
app.listen(port, function() {
    console.log("Listening on " + port);
});
/app/html/index.html

<!DOCTYPE html>
<html>
  <head>
    <title>Starters Singapore | Social Group Dating</title>
    <link rel="stylesheet" type="text/css" href="../css/index.css">
  </head>

  <body>
    <div id="testdiv">This is a test</div>
  </body>

</html>

您正在使用css文件的相对路径。此路径相对于服务器根目录,而不是html文件。我对Heroku NodeJS没有经验,但我认为这条路应该是

/css/index.css

body{
    margin:0;
    text-align: left;
    background-color: #666666;
}

#testdiv{
    width: 50%;
    height: 50%;
    background-color: #00a1ec;
}

我也在Heroku上部署应用程序。我建议使用ejs或jade来呈现html。我更喜欢ejs。由于您使用的是Express,我还将使用创建一个“公共”目录。

然后在您的布局.ejs(对于使用ejs-npm的Express 2.x.x或Express 3.x.x)


标题
您还将拥有一个index.ejs,其中您称之为layout.ejs

<%- layout('layout') %>


我还建议在ejs中使用布局时参考。学习ejs或jade一开始可能有点烦人,但一旦你更好地理解了它,它就会非常有用。希望这不是一个太重的回答。

以下是帮助我的:

var express = require('express');
var app = express();
var server = require('http').createServer(app);

app.use(express.static(__dirname + '/')); //use static dirname
假设所有内容都已放置在根文件夹中。例如,我将css文件放在一个名为css的文件夹中(在根文件夹*中)。然后我可以在index.html文件中使用
/css/bootstrap.min.css
(该文件也位于根文件夹中,作为css文件夹的邻居)


*这里的根文件夹指的是项目根文件夹。

您能更详细地解释一下您的问题吗?我拿不到。
var express = require('express');
var app = express();
var server = require('http').createServer(app);

app.use(express.static(__dirname + '/')); //use static dirname