Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/37.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/sorting/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Node.js won'；t在特定url路径长度加载css_Javascript_Css_Node.js_Express_Webpack - Fatal编程技术网
Fatal编程技术网
  • javascript/
  • Javascript Node.js won'；t在特定url路径长度加载css

Javascript Node.js won'；t在特定url路径长度加载css

javascript css node.js express webpack

Javascript Node.js won'；t在特定url路径长度加载css,javascript,css,node.js,express,webpack,Javascript,Css,Node.js,Express,Webpack,当我尝试在具有以下路径的页面上加载css时： http://wwww.example.com/test=有效 http://www.example.com/test/test=有效 http://www.example.com/test/test/test=不起作用 我正在使用NodeJS、ExpressJS和ReactJS。 我的开发服务器没有这个问题，它只发生在生产服务器上。也许这与开发人员的依赖性有关 这是迄今为止的文件夹结构 我的server.js文件 const express =

当我尝试在具有以下路径的页面上加载css时：

http://wwww.example.com/test
=有效

http://www.example.com/test/test
=有效

http://www.example.com/test/test/test
=不起作用

我正在使用NodeJS、ExpressJS和ReactJS。 我的开发服务器没有这个问题，它只发生在生产服务器上。也许这与开发人员的依赖性有关

这是迄今为止的文件夹结构

我的server.js文件

const express = require('express');
const path = require('path');
const port = 80;
const app = express();

app.use(express.static(__dirname));

app.get('*', (req, res) => {
   res.sendFile(path.resolve(__dirname + '/src/index.html'));
});

app.listen(port);
console.log('Server started and is listening on port ', port);
index.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Stadro</title>
    <link rel="stylesheet" href="../src/style/global/error.css">
    <link rel="stylesheet" href="../src/style/global/global.css">
    <link rel="stylesheet" href="../src/style/webapp/dashboard.css">
    <link rel="stylesheet" href="../src/style/webapp/content.css">
    <link rel="stylesheet" href="../src/style/webapp/hubbar.css">
    <link rel="stylesheet" href="../src/style/webapp/navbar.css">
    <link rel="stylesheet" href="../src/style/website/contact.css">
    <link rel="stylesheet" href="../src/style/website/support.css">
    <link rel="stylesheet" href="../src/style/website/header.css">
    <link rel="stylesheet" href="../src/style/website/about.css">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body class="webapp-style">
    <div class="webapp"></div>
</body>
<script src="/dist/app/bundle.js"></script>
</html>
解决方案： 谢谢@taco，我将
href路径更改为从顶层开始

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Stadro</title>
    <link rel="stylesheet" href="/src/style/global/error.css">
    <link rel="stylesheet" href="/src/style/global/global.css">
    <link rel="stylesheet" href="/src/style/webapp/dashboard.css">
    <link rel="stylesheet" href="/src/style/webapp/content.css">
    <link rel="stylesheet" href="/src/style/webapp/hubbar.css">
    <link rel="stylesheet" href="/src/style/webapp/navbar.css">
    <link rel="stylesheet" href="/src/style/website/contact.css">
    <link rel="stylesheet" href="/src/style/website/support.css">
    <link rel="stylesheet" href="/src/style/website/header.css">
    <link rel="stylesheet" href="/src/style/website/about.css">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
</head>
<body class="webapp-style">
    <div class="webapp"></div>
</body>
<script src="/dist/app/bundle.js"></script>
</html>


斯塔德罗
尝试将
src
属性更改为从顶层开始

<link rel="stylesheet" href="/{fullpathtocssfile}">
确定使用哪条路径的最简单方法是从shell进行测试

cd应用程序

find-名称“error.css”

然后将其路径用于
href
源

当您导航到@fadiabombalam时，控制台是否显示任何错误，我看不到任何错误。当我导航到example.com/test/test/so检查页面并检查头部是否显示css链接如果是，单击css的url它是否加载头部显示css路径，当我单击它时，它将我重定向到正确的文件。但是如果路径是错误的（上面的例子），那么css文件中就没有任何内容了。谢谢，这很有效！在上面的帖子中添加了解决方案！ 
<link rel="stylesheet" href="/{fullpathtocssfile}">