javascript - 尽管从模板部分提供数据，EJS 文件仍不呈现样式表

Question

我遇到了一个奇怪的问题，我的页面被路由以提供有关主页上数据库列表中的单个记录的附加信息，但没有拉入位于我的部分/头部的样式表，而是正确传递对象信息。我不太确定为什么会这样。不接受我的风格信息的具体路由是/blog/:blog_id。

routes.js

var express = require('express');
var router = express.Router();
var blogDB = require('../config/blogDB.js');
var Blogpost = require('./models/blogModel.js');
var paginate = require('express-paginate');

//index 
router.use(paginate.middleware(10, 50));

    router.route('/') 

        // START POST method
        .post(function(req, res) {

            var blogpost = new Blogpost(); // create a new instance of a Blogpost model

            blogpost.title = req.body.title; // set the blog title
            blogpost.author = req.body.author; // set the author name
            blogpost.tagline = req.body.tagline; // set the tagline
            blogpost.content = req.body.content; // set the blog content
            blogpost.category = req.body.category; // set the category
            blogpost.tags = req.body.tags; // set the tags
            blogpost.date = req.body.date; // set the date of the post
                //Save Blog Post
                blogpost.save(function(err) {
                    if (err)
                        res.send(err);

                    res.json({ message: 'Blog created.' });
                });

        }) // END POST method


        // START GET method
        .get(function(req, res, next) {

            Blogpost.paginate({}, req.query.page, req.query.limit, function(err, pageCount, blogpost, itemCount) {

                if (err) return next(err)

                        if (err)
                            res.send(err);

                        blogpost.title = req.body.title; // get the blog title
                        blogpost.author = req.body.author; // get the author name
                        blogpost.tagline = req.body.tagline; // get tagline
                        blogpost.content = req.body.content; // get the blog content
                        blogpost.category = req.body.category; // get the category
                        blogpost.tags = req.body.tags; // get the tags
                        blogpost.date = req.body.date; // get the date of the post

                        res.format({
                            html: function() {
                                res.render('pages/index', {
                                    blogpost: blogpost,
                                    pageCount: pageCount,
                                    itemCount: itemCount
                                })
                            },
                            json: function() {

                                res.json({
                                    object: 'blogpost',
                                    has_more: paginate.hasNextPages(req)(pageCount),
                                    data: blogpost
                                })
                            }
                        }); // END res.format(html, json)
            }); // END Blogpost.paginate
        }); // END GET method


    //Route for individual blogs
    router.route('/blog/:blogpost_id')


    // START GET method blog by ID  
    .get(function(req, res) {


        Blogpost.findById(req.params.blogpost_id, function(err, blogpost) {
            if (err)
                res.send(err);


            //res.json(blogpost);
            res.render('pages/blogpost', {
                blogpost: blogpost
            });
        });
    }) // END GET method blog by ID

    // START PUT method
    .put(function(req, res) {

        Blogpost.findById(req.params.blogpost_id, function(err, blogpost) {

            if (err)
                res.send(err);


            blogpost.title = req.body.title; // update the blog title
            blogpost.author = req.body.author; // update the author name
            blogpost.tagline = req.body.tagline; // update the tagline
            blogpost.content = req.body.content; // update the blog content
            blogpost.category = req.body.category; // update the category 
            blogpost.tags = req.body.tags; //update the tags
            blogpost.date = req.body.date; // update the date of the post


            blogpost.save(function(err) {
                if (err)
                    res.send(err);


                res.json({ message: 'Blog updated.' });
            });

        });

    }) // END PUT method

    // START DELETE method
    .delete(function(req, res) {

        Blogpost.remove({
            _id: req.params.blogpost_id

        }, function(err, bear) {
            if (err)
                res.send(err);

            res.json({ message: 'Successfully deleted' });
        });
    });



//about
    router.get('/about', function(req, res) {
            res.render('pages/about');
    });

//resume
    router.get('/resume', function(req, res) {
            res.render('pages/resume');
    });



module.exports = router;

部分/head.ejs:

<title>Page - Title | Example</title>

<link rel="stylesheet" type="text/css" href="stylesheets/simplegrid.css">
<link rel="stylesheet" type="text/css" href="stylesheets/styles.css">

pages/blogpost.ejs:

<html>
<head>
    <% include ../partials/head %>
</head>

<body>

    <header>
        <% include ../partials/header %>
    </header>

    <div class="grid">
        <div class="col-1-1">
            <div class="blog-content">
                <h1><%= blogpost.title %></h1>
            </div>
        </div>
    </div>


    <footer>
        <% include ../partials/footer %>
    </footer>

</body>
</html>

对比图:

生成除/blog/:blog_id 之外的任何路线时发现的样式

生成我的/blog/:blog_id 路线时发现的样式。

Answer 1

您需要在样式表前添加 /。

假设您位于 URL localhost/blog/test，浏览器将在 localhost/blog/test/stylesheets/styles.css 处查找样式表。

通过添加 /，您可以从根目录 localhost/stylesheets/styles.css

提供它们