由于某些原因CSS无法加载到hbs文件中

问题描述

所以我有一个非常基本的文件结构，但是无论出于什么原因，当我在本地主机上运行它时，我都无法在项目中显示css。除了css加载以外的所有其他内容，这是结构

我尝试了各种路径文件，并且只是直接将整个文件路径复制到相关部分中，但是仍然行不通。我正在从index.js文件中调用所有内容。

这是该代码

const path = require('path');
const express = require('express');
const hbs = require('hbs')
const app = express();
const config = require('./config/request');


const publicDirectoryPath = path.join(__dirname,'public')
// it was ../public but that did nothing
// also ./public/
// also ../public/
// also /public/
// also public/

const viewsPath = path.join(__dirname,'./templates/views')
const partialsPath = path.join(__dirname,'./templates/partials')

// error handler
app.use(function(req,res,next) {
    if(config.MARKETPLACE_ID === '' || config.SECRET === '') {
        res.send('MarketplaceId and secret must be set with your marketplace API credentials');
    } else{
        next();
    }
});

app.set('view engine','hbs')
app.set('views',viewsPath)
hbs.registerPartials(partialsPath)

app.use(express.static(publicDirectoryPath))

app.get('',(req,res) => {
    res.render('index')
})

app.listen(process.env.PORT || 3000,function(err,req,res) {
    if(err) {
        res.send('There was no endpoint listening');
    } else{
        console.log('server started on port: ',(process.env.PORT || 3000));
    }
});

css文件（它非常非常复杂，请花点时间阅读它）

.main-content {
    background-color: purple;
}

index.hbs文件

<!DOCTYPE html>

<html>

<head>
    <title>marketplace</title>
    <link rel="stylesheet" src="/literally/the/file/path/I copied/from visual studio code/public/css/styles.css" >
 I even put the file into the terminal to get the exact address cause I was convinced I was spelling something wrong
 unless all the possible tools used to determine file path on my Mac are wrong then this is the correct file path. 
</head>

<body>
  <div class="main-content">

是的。 index.hbs页面应具有紫色背景。它曾经说过有关加载MIME类型的css文件的原因或其他方面的错误，但是我基本上已经试过了，然后就解决了。现在没有背景。没有CSS加载。控制台中没有任何关于错误或文件未加载的信息。那有什么呢？

有一次我试图将所有这些都加载到我的CSS中

<link rel="stylesheet" type="text/css" src="actual path copied from the terminal the path is 100% correct>
<link rel="stylesheet type="text/css" href="100% correct file path">

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）