节点js如何使用&#34; node_modules&#34;库而不是&#34; src = <cdn>&#34;

时间:2016-11-19 17:20:45

标签: javascript angularjs node.js

我知道这是一个反复出现的问题,但我没有看到我完全理解的答案。

我在我的节点js app中使用,在我的index.html中使用了一些cdn地址。

即。 :

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"></script>

但我的node_modules目录中也有这个文件夹..所以我真的不需要使用cdn。我可以使用node_modules目录中的文件。

问题是怎么回事? 现在我有这个:

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

在我的server.js文件中。

我的node mudles文件夹的路径(与index.html在同一根路径下)。

我试着写一些像:

app.use('/scripts', express.static(__dirname + '/node_modules/'));

并在我的index.html中编写如下内容:

<script src="scripts/angular-ui-router/angular-ui-router.min.js"></script>

但是当我到localhost:3000时,应用程序甚至没有启动 因为我收到了这个错误:

Error: ENOENT, stat  ......   at Error (native)

我的问题是: 1.我需要在server.js中编写什么而不是app.use(express.static(path.join(__dirname, '/')));

2.我需要在index.html文件中编写什么,而不是:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.1/angular-ui-router.min.js"></script>

这是我在简单添加时收到的消息:

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

错误:

Error: ENOENT, stat 'C:\<path_to_my_project>\server_modules\index.html'
   at Error (native)

我不知道为什么它会在那里查找文件...我确实有一个名为&#34; server_modules&#34;的文件夹。但这不是我的index.html所在的位置...... 这是我的文件结构

- my_project
- - server.js
- - index.html
- - node_modules
- - server_modules

这是我的server.js

// ---------------- define third Party dependencies)
var express = require('express');
var app = express();
var http = require('http').Server(app);
var path = require('path');
var assert = require('assert');
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
var jwt = require('jsonwebtoken');
var expressJwt = require('express-jwt');




// ---------------- config the app
app.use(bodyParser.urlencoded({
    extended: true
}));

app.use(bodyParser.json());

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


// ---------------- define the server handlers (internal dependencies)
var dbHandler = require('./server_modules/dbHandler.js');
var httpRequesetHandler = require('./server_modules/httpRequesetHandler.js').getHttpRequestHandler(dbHandler, app,jwt,expressJwt);
var io = require('./server_modules/socketHandler.js').listen(http, dbHandler);

// ---------------- start the server
http.listen((process.env.PORT || 3000), function () {
    dbHandler.get_random_room();
    console.log('listening on *:3000 ' + __dirname);
});

另外:我在单页应用程序上使用angular进行路由

感谢

1 个答案:

答案 0 :(得分:2)

不确定您为什么会收到您正在收到的错误。我能够做你成功的要求。我的步骤:

  1. npm install --save angular-ui-router
  2. 在我的index.hml中 写道:<script src='/scripts/angular-ui-router/release/angular-ui-router.min.js' type='text/javascript'></script>
  3. 在server.js中我添加了: app.use('/scripts', express.static(path.join(__dirname, 'node_modules')));
  4. 跑吧,没问题。

    查看您的代码,看起来您指向了一个基于angular-ui模块结构不应该存在的文件路径。您还应该在html文件中查看路径语法,&#39; scripts / whatever&#39;与&#39; / scripts / what&#39;不同。

    **编辑**

    如果要从多个位置提供静态文件,只需多次声明中间件,例如:

    // serve files in /public directory from the root of the site, e.g. http://example.com/index.html would serve the file /public/index.html
    app.use(express.static(path.join(__dirname, 'public')));
    
    // also serve files in /node_modules from /scripts.  So /node_modules/angular-ui-router/release/angular-ui-router.js would be found at /scripts/angular-ui-router/release/angular-ui-router.js
    app.use('/scripts', express.static(path.join(__dirname,'node_modules')));