JS中的外部CSS

我试图将我的样式绑定到我的项目目录中的一些外部CSS。

我的应用程序structre看起来像这样:

webDTU app.js public/ stylesheets/ style.css avgrund.css animate.css views/ index.jade UserHome.jade .... .... 

我的UserHome.jade

 doctype html html head title MQTT Chat Application script(type='text/javascript', src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js') link(rel='stylesheet', href='http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic', type='text/css') link(rel='stylesheet', href='../public/stylesheets/animate.css', type='text/css') link(rel='stylesheet', href='../public/stylesheets/style.css', type='text/css') link(rel='stylesheet', href='../public/stylesheets/avgrund.css', type='text/css') body .avgrund-contents header h1 hi #{title} .pr.center.wrapper .cf.pr.chat.animate .pa.chat-shadow ..... 

我的app.js

 var express = require('express'); var path = require('path'); var favicon = require('serve-favicon'); var logger = require('morgan'); var cookieParser = require('cookie-parser'); var bodyParser = require('body-parser'); var mongoose = require('mongoose'); var mongo = require('mongodb'); var monk = require('monk'); var db = monk('localhost:27017/webDTU'); var routes = require('./routes/index'); var users = require('./routes/users'); var app = express(); // view engine setup app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'jade'); // uncomment after placing your favicon in /public //app.use(favicon(path.join(__dirname, 'public', 'favicon.ico'))); app.use(logger('dev')); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: false })); app.use(cookieParser()); app.use(express.static(path.join(__dirname, 'public'))); app.use(function(req,res,next){ req.db = db; next(); }); app.use('/', routes); // catch 404 and forward to error handler app.use(function(req, res, next) { var err = new Error('Not Found'); err.status = 404; next(err); }); // error handlers // development error handler // will print stacktrace if (app.get('env') === 'development') { app.use(function(err, req, res, next) { res.status(err.status || 500); res.render('error', { message: err.message, error: err }); }); } // production error handler // no stacktraces leaked to user app.use(function(err, req, res, next) { res.status(err.status || 500); res.render('error', { message: err.message, error: {} }); }); module.exports = app; 

我的问题是,不知何故href='../public/stylesheets/animate.css'不从我的项目目录加载正确的文件,我不明白为什么它不起作用。

然后在html中使用

 href='/public/stylesheets/animate.css'