问题 在节点中使用require('angular')会导致Window未定义


所以我对节点完全不熟悉,但我想出了如何安装node_modules。我想弄清楚的是如何在我的代码中正确包含'Angular'。

所以从一个新的快递4旋转我做了:

npm install --save angular

然后我进去了 routes/index.js 并添加了 require('angular')

var express = require('express');
var router = express.Router();
require('angular');

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;

但是当我做节点启动时,我得到一个错误,上面写着:

ReferenceError: window is not defined
    at Object.<anonymous> (/Users/al/Projects/node/podcastsearch/podcast/node_modules/angular/angular.js:26307:4)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)
    at Function.Module._load (module.js:310:12)
    at Module.require (module.js:365:17)
    at require (module.js:384:17)
    at Object.<anonymous> (/Users/al/Projects/node/podcastsearch/podcast/node_modules/angular/index.js:1:63)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)

包含角度的正确方法是什么?


12517
2018-03-22 04:39


起源



答案:


Angular是客户端幻灯片脚本库。 Node JS需要加载节点模块,而Angular不是Node模块。

在HTML页面中,您应该执行以下操作:

<html>
  <head>
    <title>My Angular App!</title>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script>
    <script src="app.js"></script>
  </head>
  <body ng-app="flapperNews" ng-controller="MainCtrl">
    <div>
      {{test}}
    </div>
  </body>
</html>

更新: 根据评论。角度模块 - https://www.npmjs.com/package/angular

获取角度js文件并将其保存在节点模块文件夹中。 Angular仍然是客户端库,您需要在HTML中添加脚本标记以使用角度。您不应该在节点代码中要求它。请检查该链接中给出的样本。

另外,您可以考虑在客户端使用require js,head js,browserify等


10
2018-03-22 04:40



我读了角度npm页面 npmjs.com/package/angular 它说我可以通过脚本或require('angular')包含它。我完全清楚角度是客户端。我很好奇为什么模块页面说它可以通过require()使用 - allencoded
@allencoded你可以使用 require() 在您的客户端脚本中使用Browserify进行类似操作。 - Brad
啊,谢谢你把它清理干净了。我知道angular是一个客户端库,只是对require()我不太了解。我确实知道我可以通过在我的html中运行node_modules / angular / angular.js来包含它但想要做spiffy require() - allencoded


答案:


Angular是客户端幻灯片脚本库。 Node JS需要加载节点模块,而Angular不是Node模块。

在HTML页面中,您应该执行以下操作:

<html>
  <head>
    <title>My Angular App!</title>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script>
    <script src="app.js"></script>
  </head>
  <body ng-app="flapperNews" ng-controller="MainCtrl">
    <div>
      {{test}}
    </div>
  </body>
</html>

更新: 根据评论。角度模块 - https://www.npmjs.com/package/angular

获取角度js文件并将其保存在节点模块文件夹中。 Angular仍然是客户端库,您需要在HTML中添加脚本标记以使用角度。您不应该在节点代码中要求它。请检查该链接中给出的样本。

另外,您可以考虑在客户端使用require js,head js,browserify等


10
2018-03-22 04:40



我读了角度npm页面 npmjs.com/package/angular 它说我可以通过脚本或require('angular')包含它。我完全清楚角度是客户端。我很好奇为什么模块页面说它可以通过require()使用 - allencoded
@allencoded你可以使用 require() 在您的客户端脚本中使用Browserify进行类似操作。 - Brad
啊,谢谢你把它清理干净了。我知道angular是一个客户端库,只是对require()我不太了解。我确实知道我可以通过在我的html中运行node_modules / angular / angular.js来包含它但想要做spiffy require() - allencoded


更新@AnujYadav使用webpack 3.4.1版的答案:

安装角度:

npm install angular --save-dev

配置(在 webpack.config.js 文件):

module.exports = {
    entry: {
        angular: path.resolve(__dirname, './node_modules/angular/angular')
    },
    output: {
        ...
    },
    module: {
        ...
    }
};

在html页面中:

<script src="/{your_path}/angular.js"></script>
<script>
    // you can use 'angular' now    
</script>

1
2017-08-08 08:57