玉器中的链接CSS文件无法加载

Question

这是我的目录结构

--votingApp
    app.js
    node_modules
    public
      css
        mystyle.css
    views
      test.jade
      mixins.jade

我已经在mixins.jade中编写了一些通用块。 test.jade是主文件。'biolerplate'，'nav'，'nav item'是mixins中的不同块。 这就是test.jade的样子

include mixins
doctype html 
html(lang="en")
    head
        +boilerplate
        link(rel="stylesheet",type="text/css",href="../public/css/mystyle.css")
    body
        +nav("Voting app","navigation_menu")
            +nav_item("#","active") Home
            +nav_item("#") Signup
            +nav_item("#") Login

这是我的app.js文件

var express=require('express');
var path=require('path');
var app=express();
app.use(express.static(path.join(__dirname,'public')));
app.set('views','./views');
app.set('view engine','jade');
app.get('/',function(req,res){
    res.render('test.jade');
});
app.listen(8000);

问题是未加载mystyle.css.mozilla开发人员控制台中的网络选项显示请求mystyle.css的错误404（请求url- http：// localhost：8000 / public / css / mystyle.css ）我该怎么办？谢谢您的阅读。

Answer 1

加载CSS时不需要相对路径，这就是为什么将公共目录定义为静态资源的原因 。

将您的链接行更新为：

link(rel="stylesheet",type="text/css",href="/public/css/mystyle.css")

Answer 2

只需使用：

link(rel="stylesheet",type="text/css",href="/css/mystyle.css")

Answer 3

相对路径永远无法与node.js配合使用，因此请使其绝对

link(rel="stylesheet",type="text/css",href="css/mystyle.css")

并使用以下行将目录设置为公用文件夹

app.use(express.static(path.join(__dirname,'public')));

因此，请不要在路径中写入公共CSS。