升级到angular-6.x会出现"Uncaught ReferenceError:global is not defined"

Ati*_*man 47 javascript angular-cli angular angular6

我将我的项目从angular-5.x升级到angular-6.x并且它开始给出以下错误,甚至创建虚拟全局变量也不起作用,如此处给出Angular 6 Auth0 - 全局未定义

错误如下:

Uncaught ReferenceError: global is not defined
    at Object../node_modules/has-binary2/index.js (index.js:10)
    at __webpack_require__ (bootstrap:81)
    at Object../node_modules/socket.io-parser/index.js (index.js:8)
    at __webpack_require__ (bootstrap:81)
    at Object../node_modules/socket.io-client/lib/index.js (index.js:7)
    at __webpack_require__ (bootstrap:81)
    at Object../src/app/app4pc/apiConnection/services/ApiConnectionServer.ts (auth.interceptor.ts:8)
    at __webpack_require__ (bootstrap:81)
    at Object../src/app/app4pc/apiConnection/toServer.module.ts (ApiConnectionServer.ts:11)
    at __webpack_require__ (bootstrap:81)
Run Code Online (Sandbox Code Playgroud)

解决这个后,我得到以下错误:

Uncaught ReferenceError: process is not defined
    at Object../node_modules/process-nextick-args/index.js (index.js:3)
    at __webpack_require__ (bootstrap:81)
    at Object../node_modules/readable-stream/lib/_stream_readable.js (_stream_readable.js:26)
    at __webpack_require__ (bootstrap:81)
    at Object../node_modules/readable-stream/readable-browser.js (readable-browser.js:1)
    at __webpack_require__ (bootstrap:81)
    at Object../node_modules/simple-peer/index.js (index.js:7)
    at __webpack_require__ (bootstrap:81)
    at Object../src/app/util/services/call.services.ts (notification.service.ts:12)
    at __webpack_require__ (bootstrap:81)    
Run Code Online (Sandbox Code Playgroud)

并继续下去.

Voj*_*ech 75

添加此行polyfills.ts应解决节点全局错误

(window as any).global = window;

在这个角度cli问题中提到了解决方案

  • 正如 @risingTide 提到的,添加为 polyfills.ts 文件的导入对我有用。 (3认同)
  • 按照angular-cli的建议,添加到polyfills.ts并不能解决我的问题。似乎某些第三方库正在尝试加载polyfills.ts之前访问全局(即,也许在angular加载之前?)。解决该问题的唯一方法是通过修改index.html页面来遵循上述公认的解决方案。:-( (2认同)
  • 如果将它_直接_添加到 polyfills.ts 不起作用,另一种仍然使用此解决方案的方法是添加一个新文件(例如,称为 global-shim.ts)并在其中添加脚本,然后导入新文件进入 polyfills.ts。这个解决方案在这个 [angular-cli issue thread](https://github.com/angular/angular-cli/issues/8160#issuecomment-392716566) 中提到 (2认同)

Akh*_*mar 74

在您的起始页面中添加以下代码,例如index.html

var global = global || window;
var Buffer = Buffer || [];
var process = process || {
  env: { DEBUG: undefined },
  version: []
};
Run Code Online (Sandbox Code Playgroud)

例如:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Client</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <script>
    var global = global || window;
    var Buffer = Buffer || [];
    var process = process || {
      env: { DEBUG: undefined },
      version: []
    };
  </script>
</head>
<body>
  <app-root>
    <div class="loader"></div>
  </app-root>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

以上将适用于混合应用程序(在节点环境中)以及浏览器中

  • __CODE__ // for Uncaught ReferenceError:未定义global

  • __CODE__ // for Uncaught ReferenceError:未定义Buffer

  • __CODE__ // for Uncaught ReferenceError:未定义进程

  • __CODE__ // Uncaught TypeError:无法读取未定义的属性"slice"

  • 它有效,但你能解释这个错误的原因以及它是如何修复的吗? (2认同)
  • 对于来这里的任何人,请检查要添加的http客户端模块是否来自@ angular / common / http或selenium-webdriver / http。selenium-webdriver / http也将导致相同的问题。 (2认同)

Tod*_*ton 6

我使用HttpClient并意外选择了默认导入'selenium-webdriver/http'

如果您的app.module.ts有 import { HttpClient } from 'selenium-webdriver/http';

更新到 import { HttpClient } from '@angular/common/http';

那解决了我的问题。


Mal*_*y M 5

添加这一行来解决我的问题(只是@kemalbirinci在这里pollyfills.ts所说的解决方法)

(window as any).global = window;