Node.js的 为什么页面无法加载CSS和JavaScript文件?

我已经创build了一个node.js服务器。 当我使用端口3000进入本地主机,它只显示文本没有CSS或JavaScript。 我已经尝试了几个解决scheme,在其他人的工作。 但他们没有为我工作。

节点JS继续无法加载资源错误消息

静态文件与express.js

无法获取CSS文件

我的文件顺序是这样的

server.js index.html public css style.css 

这是服务器的代码

 var express = require('express'); var app = express(); app.get('/', function(req, res) { res.sendFile(__dirname + '/index.html');}); app.use(express.static(__dirname + 'public')); app.listen(3000); 

这些是错误

 GET http://localhost:3000/ [HTTP/1.1 304 Not Modified 11ms] GET http://localhost:3000/public/css/demo.css [HTTP/1.1 404 Not Found 10ms] GET http://localhost:3000/public/css/themes/popclip.css [HTTP/1.1 404 Not Found 10ms] GET http://localhost:3000/public/css/reveal.min.css [HTTP/1.1 404 Not Found 19ms] GET http://localhost:3000/public/css/theme/default.css [HTTP/1.1 404 Not Found 12ms] GET http://localhost:3000/public/css/jquery.dropdown.css [HTTP/1.1 404 Not Found 11ms] GET http://localhost:3000/node_modules/socket.io/node_modules/socket.io-client/socket.io.js [HTTP/1.1 404 Not Found 10ms] GET http://localhost:3000/public/js/jquery.min.js [HTTP/1.1 404 Not Found 29ms] GET http://localhost:3000/public/js/jquery.popline.js [HTTP/1.1 404 Not Found 28ms] GET http://localhost:3000/public/js/plugins/jquery.popline.link.js [HTTP/1.1 404 Not Found 28ms] 

这个:

 __dirname + 'public' 

应该:

 __dirname + '/public' 

此外,它看起来像你的HTML / CSS的path可能不正确,因为__dirname + '/public'将是你的 。 所以,除非你有一个目录__dirname + '/public/public'你将不得不改变你的HTML / CSS的path。

问题解决了。

问题出在我的index.html文件中。 最初我以为,当我创build一个新的文件夹,并把所有的CSS和JS文件在那里,我需要在所有的src中添加“公共”。 喜欢这个

 <script src="public/js/jquery.min.js"></script> <script src="public/js/jquery.popline.js"></script> 

但相反,我只需要做到这一点,没有像这样的“公共”文件夹

 <script src="js/jquery.min.js"></script> <script src="js/jquery.popline.js"></script> 

并将__dirname + 'public'__dirname + '/public'如build议的mscdex) 。

尝试了几个项目后,我只想列出我的工作成果,以防其他人帮助。

我尝试过的代码行,但没有为我工作:

 app.use('/css', express.static(__dirname + '/public')); app.use(express.static(__dirname + '/public')); app.use(express.static(path.join(__dirname, '../public'))); 

我的项目是在“项目”文件夹,其中包含“公共”文件夹,“视图”文件夹和server.js文件。 节点,Express和Handlebars被用来渲染页面。 在“公共”是一个文件夹“CSS”,我的style.css文件被保存。

在server.js我使用

 var express = require('express'); var app = express(); app.use(express.static('public')); 

在我的main.handlebars文件中的“视图”>“布局”,我在该部分

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

有了这些,启动一个本地实例工作,加载样式表时没有“404”错误消息。