我一般相当新的Node.js和JavaScript,但我想用尽可能少开销尽可能建立一个网站。
我想的Node.js和引导来实现这一目标。
这是我的server.js文件:
var http = require('http');
var fs = require("fs");
http.createServer(
//This function decides which content type to use for wich type of request.
//This is also used to restrict the type of files that a user is allowoed to request.
function(request, response) {
//For debugging
console.log(request.connection.remoteAddress.toString() + " requested the url " + request.url.toString());
if(/^\/[a-zA-Z0-9\/]*.css$/.test(request.url.toString())){
//Send the requested file if it end with .css
sendFileContent(request, response, request.url.toString().substring(1), "text/css");
}
else if(/^\/[a-zA-Z0-9\/]*.js$/.test(request.url.toString())){
//Send the requested file if it end with .js
sendFileContent(request, response, request.url.toString().substring(1), "text/javascript");
}
else {
//Answer any other request with the index.html file, because this is a single page application.
sendFileContent(request, response, "index.html", "text/html");
}
}
).listen(80);
function sendFileContent(request, response, fileName, contentType){
fs.readFile(fileName, function(err, data){
if(err){
response.writeHead(404);
//TODO: Better 404 page!
response.write("Not Found!");
console.log(request.connection.remoteAddress.toString() + " received a 404 error");
}
else{
response.writeHead(200, {'Content-Type': contentType});
response.write(data);
}
response.end();
});
}
它工作得很好。 如果我添加脚本的HTML文档,例如,使用document.write()
它,它出现在页面上。 现在为引导,我看到你只需要四个文件,通常是通过CDN或类似的WebPack或凉亭的工具提供。 所以,我刚刚下载的四个文件bootstrap.min.js,bootstrap.min.css,jquery.min.js和popper.js并把它们放在一个文件夹中的脚本旁边的文件的其余部分。 当然,我喜欢使用相对路径scripts/bootstrap/js/bootstrap.min.js
而不是CDN链接。
当运行Node.js的服务器,我可以看到, 文件获取请求并将它们发送成功 ,但不知何故,引导一下不出现(但一切都是可见的)。
下面是我使用的HTML文件(index.html的):
<!DOCTYPE html>
<html lang="en">
<head>
<title>Index</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="scripts/bootstrap/css/bootstrap.min.css">
</head>
<body>
<div class="alert alert-primary" role="alert">
This is an alert!
</div>
<script type="text/javascript" src="scripts/jquery/jquery.min.js"></script>
<script type="text/javascript" src="scripts/popper/popper.js"></script>
<script type="text/javascript" src="scripts/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
而现在,这里的怪异的一部分:打开index.html文件手动导致所有引导元素的正确显示。 这就是为什么我断定它是与Node.js的
有谁知道如何解决这一问题?