如何在 Nodejs、ExpressJS 中使用外部 js-File答案

【问题标题】：How to use an external js-File in Nodejs, ExpressJS如何在 Nodejs、ExpressJS 中使用外部 js-File
【发布时间】：2016-11-27 04:25:47
【问题描述】：

我今天开始使用 NodeJS、ExpressJS、Android 来创建一个小的 Web 应用程序。我遇到了一个问题，它困扰了我一整天！

环境：

服务器：NodeJS、ExpressJS

客户：HTML,Angular,CSS

我尝试从 node_modules 文件夹加载 CSS 和 JavaScript 文件。但它不起作用。它仅适用于在线资源

有效

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
  <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
  <script type="text/javascript" src="../public/javascript/test.js"></script>

不起作用

<script type="text/javascript" src="../public/javascript/test.js"></script>

服务器一直写404错误

我尝试过绝对路径和相对路径。我也尝试过来自其他 stackoverflow 帖子的一些建议。没有结果。

Servercode 是由 Eclipse IDE 使用“Express JS Project”创建的

app.js

    var express = require('express')
  , routes = require('./routes')
  , user = require('./routes/user')
  , http = require('http')
  , path = require('path')

    ,pageX = require('./routes/pageX');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if ('development' == app.get('env')) {
  app.use(express.errorHandler());
}

app.get('/', routes.index);
app.get('/pageX', function(req,res){
    console.log("TEST - PageX");
    res.send(pageX.pageX(req, res));
});
app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

迈克尔

【问题讨论】：

你能不能把http.createServer(app).listen(...)换成app.listen(port, function() { console.log('Listening to port: ' + port); });
这是我工作源代码中的 sn-p 'use strict'; var express = require('express'); var app = express(); var config = require('./config'); app.use(function (req, res, next) { console.log('%s %s', req.method, req.url); next(); }); app.use('/uploads', express.static(__dirname + '/uploads')); app.listen(config.port, function(){ console.log('Listening to port ' + config.port); });
@GurbakhshishSingh ：感谢您的快速响应，它不起作用。当我尝试调用公用文件夹中的函数时，我一直收到 500 错误。 :(

标签： angularjs node.js express

【解决方案1】：

根据docs，使用这个时：

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

Express 查找相对于静态目录的文件，因此静态目录的名称不是 URL 的一部分。

因此，要加载您的 test.js，您应该使用：

<script type="text/javascript" src="/javascript/test.js"></script>

另外，这意味着您应该在__dirname 下有一个public 目录。

如果我对您的理解正确，并且从您所说的到目前为止您已经尝试过，您正在从 node_modules 内部运行 node，并且您具有以下目录结构：

app-root-directory/
    public/
    node_modules/

我对节点也很陌生，我相信你不应该从node_modules 内部运行。但如果你是，那么path.join(__dirname, 'public') 不是你想要的，因为它会在node_modules 中指向public。

所以你还得把express.static的根目录改成../public：

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

【讨论】：

【解决方案2】：

尝试使用这个。为我工作。

var express = require('express');
var app = express();
app.use('/js', express.static(__dirname + '/public/js'));

【讨论】：