68 votes

La mise à niveau vers angular-6.x donne le message "Uncaught ReferenceError : global is not defined".

J'ai mis à jour mon projet d'angular-5.x à angular-6.x et il a commencé à donner l'erreur suivante et même la création de la variable globale fictive ne fonctionne pas comme indiqué ici. Angular 6 Auth0 - global non défini

L'erreur est la suivante :

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)

Après avoir résolu ce problème, je reçois l'erreur suivante :

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)    

Et ça continue encore et encore.

0 votes

Vérifiez la version de votre CLI : github.com/angular/angular-cli/issues/8160

0 votes

Au cas où quelqu'un rencontrerait cette erreur avec ng 6 et AWS cognito, j'ai trouvé une solution de contournement, décrite ici : stackoverflow.com/a/50377270/2398593

122voto

Vojtech Points 876

En ajoutant cette ligne à polyfills.ts devrait résoudre l'erreur globale du nœud

(window as any).global = window;

La solution a été mentionnée dans ce angular-cli issue thred

3 votes

L'ajout à polyfills.ts, comme suggéré dans angular-cli, n'a pas résolu le problème pour moi. Il semble qu'une bibliothèque tierce tente d'accéder à global AVANT que polyfills.ts ne soit chargé (c'est-à-dire peut-être avant qu'angular ne soit chargé ?). La seule façon de contourner le problème était de suivre la solution acceptée ci-dessus en modifiant ma page index.html. :-(

2 votes

Si vous l'ajoutez directement à polyfills.ts ne fonctionne pas, une autre façon d'utiliser encore cette solution est d'ajouter un nouveau fichier (appelé global-shim.ts, par exemple) et d'y ajouter le script, puis d'importer le nouveau fichier dans polyfills.ts. Cette solution a été mentionnée dans ce Fil de discussion sur les problèmes liés à angular-cli

3 votes

L'ajout en tant qu'importation au fichier polyfills.ts comme mentionné par @risingTide a fonctionné pour moi.

117voto

Akhilesh Kumar Points 2933

Ajouter le code suivant dans votre page de départ, par exemple index.html

var global = global || window;
var Buffer = Buffer || [];
var process = process || {
  env: { DEBUG: undefined },
  version: []
};

Exemple :

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Client</title>
  <base href="http://stackoverflow.com/">
  <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>

Ce qui précède fonctionnera sur une application hybride (dans l'environnement Node) ainsi que dans un navigateur.

  • pour "Uncaught ReferenceError : global is not defined" :

    var global = global || window;
  • pour "Uncaught ReferenceError : Buffer is not defined" :

    var Buffer = Buffer || [];
  • pour "Uncaught ReferenceError : process is not defined" :

    var process = process || {
      env: { DEBUG: undefined }
    }
  • pour "Uncaught TypeError : Cannot read property 'slice' of undefined" :

    var process = process || {
      env: { DEBUG: undefined },
      version: []
    };

1 votes

Comment corriger cette erreur Uncaught TypeError : Impossible de lire la propriété 'slice' d'undefined.

2 votes

Cela a fonctionné mais pouvez-vous expliquer la raison de cette erreur et comment la corriger ?

1 votes

Fondamentalement, le nouvel environnement angulaire, il attend ces variables globales qui ne sont disponibles que dans l'environnement node. Nous avons donc créé un proxy pour elles.

8voto

Todd Skelton Points 991

J'utilise HttpClient et j'ai accidentellement sélectionné l'importation par défaut qui était 'selenium-webdriver/http'

Si votre app.module.ts a import { HttpClient } from 'selenium-webdriver/http';

Mettez-le à jour en import { HttpClient } from '@angular/common/http';

Cela a réglé mon problème.

0 votes

Superbe. C'est le même problème pour moi. J'ai fait comme vous avez dit et ça a marché. Merci beaucoup.

2voto

Malay M Points 776

En ajoutant cette ligne dans pollyfills.ts a corrigé mon problème (juste une solution de contournement comme @kemalbirinci a dit ici )

(window as any).global = window;

2voto

Veuillez faire attention en utilisant la première réponse qui consiste à ajouter l'inline script à index.html. Cela résoudra le problème immédiat. Cependant, si vous utilisez SignalR, cela générera cette erreur :

Erreur : Erreur d'analyse de la réponse à la poignée de main : TypeError : Le côté droit de 'instanceof' n'est pas appelable à l'adresse HubConnection.push../node_modules/@microsoft/signalr/dist/esm/HubConnection.js.HubConnection.processHandshakeResponse

Cependant, la définition de global en tant que telle fonctionnera et ne cassera pas Signal R.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X