直接命中静态CSS文件url（http：// localhost：3000 / css / style.css）响应有效，但不适用于ejs模板元素吗？

Question

嗨，我是node.js的新手。我正在使用ejs部分模板。在这个问题上，我已经停留了几天，在根目录中有public / css / style.css文件。我从views / contact.ejs和views / home.ejs

访问此文件的位置

Contact.ejs！-开始代码段：js隐藏：虚假控制台：真babel：假->

<!DOCTYPE html>
<html lang="en">

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

<body>
    <%- include('partialComponents/naviagations.ejs') %>
        <H3>CONTACTS US !</H3>
        <h2>LEARN THE BEST CODE TECHNIQUES HERE ....</h2>
        <h2>EJS FILE TEMPLATE </h2>
</body>

</html>

main.js

var express = require('express');
var app = express();

app.set('view engine', 'ejs');
//app.set('views', '/views'); // settings the path to view folder to express can locate
//by default express will check the view folder in first root to the js file

app.use(express.static('public'))
app.get('/profile/:id', (req, res) => {

    var data = {
        age: 23,
        job: 'software developer',
        hobbies: ['eating', 'fishing', 'gaming']
    }
    console.log('hey');
    res.render('profile', { name: req.params.id, data: data });
});

app.get('/home', (req, res) => {

    res.render('home');
});
app.get('/', (req, res) => {

    res.render('home');
});
app.get('/contact', (req, res) => {

    res.render('contact');
});



app.listen(3000);
// console.log(__dirname + "");

style.css

body {
    background-color: skyblue;
    text-align: center;
}

h3 {
    font-size: 50px;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: white;
}

h2 {
    color: white;
}

.testid {
    color: red;
}

这是我的文件结构

Answer 1

👨‍🏫您在链接href中丢失了。 您可以更改链接href，并在👇下面加上以下代码：

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

例如：您可以在我的sandbox]上看到>

希望它能对您有所帮助。

直接命中静态CSS文件url（http：// localhost：3000 / css / style.css）响应有效，但不适用于ejs模板元素吗？

问题描述投票：0回答：1

1个回答

最新问题

直接命中静态CSS文件url（http：// localhost：3000 / css / style.css）响应有效，但不适用于ejs模板元素吗？

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1