programing

angular-6.x로 업그레이드하면 "Uncaught ReferenceError: global is not defined"라는 메시지가 표시됩니다.

megabox 2023. 10. 16. 21:42
반응형

angular-6.x로 업그레이드하면 "Uncaught ReferenceError: global is not defined"라는 메시지가 표시됩니다.

프로젝트를 angular-5.x에서 angular-6.x로 업그레이드했는데 다음 오류가 발생하기 시작했고 더미 글로벌 변수 생성도 여기서 주어진 대로 작동하지 않습니다. Angular 6 Auth0 - global not defined

오류는 다음과 같습니다.

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)

이 문제를 해결하면 다음과 같은 오류가 발생합니다.

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)

그리고 계속해서 계속됩니다.

을 에 하는 중polyfills.ts다를(를) .

(window as any).global = window;

해결책은 이 각도클립 문제 스레드에서 언급되었습니다.

시작 페이지에 다음 코드 추가(예: index.html)

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

예:

<!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>

위는 브라우저 뿐만 아니라 (노드 환경에서) 하이브리드 앱에서도 작동합니다.

  • "Uncatched ReferenceError: global is not defined"에 대해:

    var global = global || window;

  • "Uncatched ReferenceError: Buffer is not defined"의 경우:

    var Buffer = Buffer || [];

  • "Uncatched ReferenceError: process is not defined"의 경우:

    var process = process || {
  env: { DEBUG: undefined }
}

  • "Uncatched TypeError: 정의되지 않은 속성 '슬라이스'를 읽을 수 없습니다":

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

사용합니다.HttpClient로 기본 했습니다를 했습니다.'selenium-webdriver/http'

.module.ts가 있는 경우import { HttpClient } from 'selenium-webdriver/http';

위치:import { HttpClient } from '@angular/common/http';

그 일로 문제가 해결됐습니다.

을 에 pollyfills.ts내 문제를 해결했습니다. (여기서 @kemalbirinci가 말한 해결책입니다.)

(window as any).global = window;

만약 당신의 타겟이 웹팩의 노드일 경우)target: 'node'), 입니다합니다."Can't resolve 'fs'과 같은 . 합니다. 합니다.Fix: "Uncaught ReferenceError: global is not defined"그것을 다음과 같이 합니다.node: { global: true, fs: 'empty' }. 보너스: 오류가 발생한 경우"Uncaught ReferenceError: exports is not defined".간단히 덧붙이기만libraryTarget: 'umd'와 같습니다 전체 웹팩 구성 코드는 아래와 같습니다.

const webpackConfig = {
  node: { global: true, fs: 'empty' }, // Fix: "Uncaught ReferenceError: global is not defined", and "Can't resolve 'fs'".
  output: {
    libraryTarget: 'umd' // Fix: "Uncaught ReferenceError: exports is not defined".
  }
};

module.exports = webpackConfig; // Export all custom Webpack configs.

여기에 많은 솔루션이 제안되어 있습니다. https://github.com/angular/angular-cli/issues/8160

index.html에 인라인 스크립트를 추가하는 상위 답변을 사용하면 당장의 문제를 해결할 수 있으니 주의하시기 바랍니다.그러나 SignalR을 사용하는 경우 다음과 같은 오류가 발생합니다.

오류: 핸드셰이크 응답 구문 분석 오류:오류 유형: HubConnection.push..에서 'instance of'의 오른쪽을 호출할 수 없습니다./node_modules/@microsoft/signalr/dist/esm/HubConnection.js.HubConnection.processHandshake 응답

그러나 글로벌을 정의하는 것만으로 신호 R이 깨지지는 않습니다.

에서 되었습니다.Package.JSON파일 확인 후 패키지에 설치 부탁드립니다.

Angular v6로 migration 후 polyfills.ts에 아래 행을 추가하면 저는 잘 되었습니다.

(window as any).global = window;
global.Buffer = global.Buffer || require('buffer').Buffer;
global.process = require('process');

여기서 얻은 답변

이것이 문제를 이해하는 데 도움이 될지는 모르겠습니다. 사용자 측에서 전역적으로 정의되지 않은 오류가 발생한 이 글을 읽는 모든 사람에게 사용자의 위치를 묻는 페이지에 대한 브라우저 및/또는 장치 설정을 확인하도록 알려줄 것입니다.방금 크롬 브라우저 사이트 설정 안에 들어가서 위치 옵션을 먼저 묻는 것에서 차단하는 것으로 전환했습니다.바로 다음 페이지를 방문했을 때, 데이터 테이블로의 주요 내용은 크롬 사이트 설정에서 먼저 묻기 위해 위치를 다시 전환하고 오류 없이 로드된 페이지를 새로 고쳤습니다.

언급URL : https://stackoverflow.com/questions/50356408/upgrading-to-angular-6-x-gives-uncaught-referenceerror-global-is-not-defined

반응형

'programing' 카테고리의 다른 글

데이터베이스에 직접 액세스하기 위한 개발자 도구  (0) 2023.10.16
표에서 BLOB 열의 총 데이터 크기 계산  (0) 2023.10.16
MariaDB 파일 권한 내 데이터 로드 오류  (0) 2023.10.16
줄 바꿈 없이 정당화된 CSS 메뉴가 작동하지 않음줄 바꿈 없이 정당화된 CSS 메뉴가 작동하지 않음  (0) 2023.10.16
MYSQL 오류:사용자 'root'@'localhost'(1045)에 대한 액세스가 거부되었습니다.  (0) 2023.10.16

'programing'의 다른글

  • 현재글angular-6.x로 업그레이드하면 "Uncaught ReferenceError: global is not defined"라는 메시지가 표시됩니다.

관련글

댓글

티스토리툴바