javascript 未加载到 HTML 文件中 - nodejs + expressjs答案

【问题标题】：javascript not loading in HTML file - nodejs + expressjsjavascript 未加载到 HTML 文件中 - nodejs + expressjs
【发布时间】：2014-03-29 07:26:21
【问题描述】：

我是 nodejs 和 expressjs 的新手，所以我尝试构建简单的 Web 应用程序来掌握这两个框架。在这里，我构建了一个具有以下架构的项目：

js
   test.js
views
   index.html
server.js

我的服务器文件如下所示：

var fs = require("fs");
var host = "127.0.0.1";
var port = 1337;
var express = require("express");
var ejs =  require("ejs");

var server = express();
server.use(server.router);
server.use(express(__dirname)); 
server.set('view engine','html');
server.engine('html', require('ejs').renderFile);

server.get("*", function(request, response){ 
    response.render('index.html');
});

server.listen(port, host);

我的索引文件是这样的：

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Starter Template for Bootstrap</title>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script language="javascript"  src="/js/test.js" type="text/javascript"></script>
</head>

<body ng-app>
    <div class="container">
        <div class="starter-template">
           some code
        </div>

    </div><!-- /.container -->
</body>
</html>

我的 index.html 文件正确加载，但我无法加载 test.js 文件。我该如何解决这个问题？

【问题讨论】：

控制台中是否出现任何错误？
在终端我没有得到任何错误，但在客户端我得到这个： Uncaught SyntaxError: Unexpected token
@ArnaudDrizard 如果控制台报告您在 test.js 中出现错误，则意味着 test.js 至少已加载:)
您的test.js 文件是否经过验证？ bootstrap.min.js 来自哪里？
我不明白的是我只放了 console.log('test');在 test.js 中并没有打印任何内容

标签： javascript node.js express routes

【解决方案1】：

在nodejs端：

var path    = require("path");
app.use(express.static(path.join(__dirname + '/js')));//middleware

在 HTML 页面中：

<script src="./my_script.js"></script>

【讨论】：

【解决方案2】：

JS 文件被呈现为静态文件。参考：https://expressjs.com/en/starter/static-files.html 首先创建一个“静态”文件夹并将 .js 文件保存在其中。现在，在 .ejs 文件中更正这些 .js 文件的脚本标签。

【讨论】：

【解决方案3】：

在Express中使用express.static内置的中间件函数。

在 server.engine 之后添加这一行。这种机制应该允许提供静态文件，例如图片、javascripts、css

app.use(express.static(__dirname + '/js'));

现在你可以加载了：

http://localhost:1337/js/test.js

【讨论】：

【解决方案4】：

将 render 更改为 sendfile 并将您的 js 文件夹移动到 public 文件夹，然后添加此中间件 server.use(express(__dirname+'/public'));

【讨论】：