当我在本地主机中运行HTML页面时,我有一个节点js服务器,但由于我的本地js和css文件,在控制台中出现 Error Uncaught SyntaxError:Unexpected token << / strong> >无法加载。 我经历了-Node.js serve HTML, but can't load script files in served page 但这没用
我有一个文件结构 enter image description here
我的服务器代码server.js
节点js:-
var express = require('express');
var http = require('http');
var fs = require('fs');
var app = express();
app.use(express.static(__dirname + '/public'));
app.get('*', function(req, res) {
console.log("Global");
res.sendFile(__dirname + '/public/index.html');
});
var port = process.env.PORT || 7000;
http.createServer(app).listen(7000);
我的HTML文件index.html是
<!DOCTYPE html>
<html>
<head>
<title>sample spa app</title>
<link rel="stylesheet" type="text/html" href="css/style.css">
</head>
<body>
<li><a href="#home">home</a></li>
<li><a href="#about">about</a></li>
<div>
<h2>you are in index.html</h2>
</div>
<div id="app">
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
<script src="public/js/app.js" type="text/javascript"></script>
</body>
</html>
答案 0 :(得分:0)
<!DOCTYPE html>
<html>
<head>
<title>sample spa app</title>
<link rel="stylesheet" type="text/html" href="css/style.css">
</head>
<body>
<li><a href="#home">home</a></li>
<li><a href="#about">about</a></li>
<div>
<h2>you are in index.html</h2>
</div>
<div id="app">
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="./js/app.js" type="text/javascript">
</script>
</body>
</html>
答案 1 :(得分:0)
<link rel="stylesheet" type="text/html" href="css/style.css">
在静态处理程序将试图找到一个文件sampleProject/public/css/style.css
<script src="public/js/app.js" type="text/javascript"></script>
静态处理程序将尝试找到文件sampleProject/public/public/js/app.js
(是的,我写了public/public
)。
这些存在的无,因此静态处理器可以让该请求传递给下一个路由。无论请求是什么,下一条路线都会强制sampleProject/public/index.html
进行服务。因此,您的错误。
app.use('/public', express.static(__dirname + '/public'));
(作为补充,您应该require('path')
并声明express.static(path.join(__dirname, 'public'))
,这比手动连接更安全,更可移植。)
这告诉应用程序仅在路由以/public
开头时使用静态处理程序。
将css
文件夹移至public/css
,并在调用JS时将路径更改为:
<script src="/js/app.js" type="text/javascript"></script>
读取关于碱基here