Node.js 无法加载css文件_Node.js_Express

Node.js 无法加载css文件

node.js express

Node.js 无法加载css文件,node.js,express,Node.js,Express,我正在尝试使用登录模板（取自：我的目录设置如下所示： -css | -- style.css - js | -- index.js | index.html index.html文件的头部看起来： <head> <meta charset="UTF-8"> <title>Sign-Up/Login Form</title> <link href='http://fonts.googleapis.com/css?fa

我正在尝试使用登录模板（取自：

我的目录设置如下所示：

-css
 |
 -- style.css
- js
 |
 -- index.js
 |
index.html

index.html文件的头部看起来：

<head>
  <meta charset="UTF-8">
  <title>Sign-Up/Login Form</title>
  <link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,300,600' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">


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


</head>

加载html文件时，我遇到错误：

GET http://127.0.0.1:3001/css/style.css

我已尝试在以下方面寻求解决方案：

并创建了公用文件夹并将css文件夹复制到其中，但仍然无法工作

如何加载css&js文件？

在您的代码和文件夹设置中，一切看起来都很好。从您发布的URL（

http://127.0.0.1:3001/css/style.css

），我猜错误在于您的服务器实例。请检查定义文件并确保服务器具有读取css/style.css的权限

当文件和文件夹没有正确的权限时，我遇到了此问题。对此的快速检查正在运行类似于

sudo chmod-R 0777[路径到您的项目]

（linux和Mac系统将使用此命令）。此命令授予所有用户和来宾读取、写入和执行文件的完全访问权限，是验证问题是否为用户权限的快速方法

当我的web服务器配置不正确时，我也遇到了同样的问题。在这种情况下，我意外地允许web服务器共享根文件夹（例如：/var/www）中的所有文件，但不共享任何子文件夹，因此（使用示例）web服务器将解析文件夹/var/www/images，并将其视为受保护的区域。在这种情况下，web服务器具有访问权限，但它拒绝根据配置规则提供文件

我希望这两个修复中的一个可以帮助您找到正确的解决方案

祝你好运！

我们必须在根目录上创建一个目录public，并将目录css放入其中

// Import Required Module
var express = require('express')
var app = express()
var bodyParser = require('body-parser')

// Create instances
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({    
  extended: true
})); 

// Get
app.get('/', function (req, res) {
  console.log('Get: /');
  res.sendFile('LoginTemplate/index.html', {root: __dirname })
})


app.get('/css/style.css', function (req, res) {
    console.log('Get: css/style.css'); 
    res.sendFile('LoginTemplate/css/style.css', {root: __dirname })
})

app.get('/js/index.js', function (req, res) {
    console.log('Get: js/index.js'); 
    res.sendFile('LoginTemplate/js/index.js', {root: __dirname })
})


// Listner
app.listen(3001, function () {
  console.log('Example app listening on port 3001!')
})

GET http://127.0.0.1:3001/css/style.css

// Import Required Module
var express = require('express')
var app = express()
var bodyParser = require('body-parser')

// Create instances
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({    
  extended: true
})); 

// Get
app.get('/', function (req, res) {
  console.log('Get: /');
  res.sendFile('LoginTemplate/index.html', {root: __dirname })
})


app.get('/css/style.css', function (req, res) {
    console.log('Get: css/style.css'); 
    res.sendFile('LoginTemplate/css/style.css', {root: __dirname })
})

app.get('/js/index.js', function (req, res) {
    console.log('Get: js/index.js'); 
    res.sendFile('LoginTemplate/js/index.js', {root: __dirname })
})


// Listner
app.listen(3001, function () {
  console.log('Example app listening on port 3001!')
})