TypeScript에서 전역 변수 만들기

TypeScript에서 전역 변수 만들기

---

JavaScript에서는 다음과 같이 할 수 있습니다.

 something = 'testing';

그리고 다른 파일에서 :

 if (something === 'testing')

something(올바른 순서로 호출되는 한) 정의 될 것 입니다.

TypeScript에서 수행하는 방법을 알아낼 수없는 것 같습니다.

이것이 내가 시도한 것입니다.

.d.ts 파일에서 :

interface Window { something: string; }

그런 다음 내 main.ts 파일에서 :

 window.something = 'testing';

그런 다음 다른 파일에서 :

 if (window.something  === 'testing')

그리고 이것은 작동합니다. 그러나 나는 window.그것 의 일부 를 잃고 단지 내가 something글로벌 이 되기를 원합니다 . TypeScript에서 수행하는 방법이 있습니까?

(관심이있는 사람이있는 경우 애플리케이션에 대한 로깅을 설정하려고 log.Debug합니다. 개체를 가져 와서 만들지 않고도 모든 파일에서 호출 할 수 있기를 원합니다 .)

---

좋아요, 이건 당신이했던 것보다 더 못 생겼 겠지만 어쨌든 ...

^{하지만 나도 똑같이 ...}

순수한 TypeScript에서 할 수있는 일은 다음 eval과 같은 함수 를 사용하는 것입니다.

declare var something: string;
eval("something = 'testing';")

그리고 나중에 할 수 있습니다

if (something === 'testing')

이것은 TypeScript가 컴파일을 거부하지 않고 명령을 강제 실행하는 해킹 declare var에 지나지 않으며 TypeScript가 나머지 코드를 컴파일하도록합니다.

---

.d.ts정의 파일 내부

type MyGlobalFunctionType = (name: string) => void

브라우저에서 작업하는 경우 브라우저의 창 컨텍스트에 멤버를 추가합니다.

interface Window {
  myGlobalFunction: MyGlobalFunctionType
}

NodeJS에 대한 동일한 아이디어 :

declare module NodeJS {
  interface Global {
    myGlobalFunction: MyGlobalFunctionType
  }
}

이제 루트 변수를 선언합니다 (실제로 창 또는 전역에 있음).

declare const myGlobalFunction: MyGlobalFunctionType;

그런 다음 일반 .ts파일에서 부작용으로 가져 오면 실제로 구현합니다.

global/* or window */.myGlobalFunction = function (name: string) {
  console.log("Hey !", name);
};

마지막으로 다음 중 하나를 사용하여 코드베이스의 다른 곳에서 사용합니다.

global/* or window */.myGlobalFunction("Kevin");

myGlobalFunction("Kevin");

---

TypeScript와 결합 된 JavaScript를 사용하면 작동하는 방법을 찾았습니다.

logging.d.ts :

declare var log: log4javascript.Logger;

로그 선언. js :

log = null;

initalize-app.ts

import './log-declaration.js';

// Call stuff to actually setup log.  
// Similar to this:
log = functionToSetupLog();

이것은 그것을 전역 범위에 놓고 TypeScript는 그것에 대해 알고 있습니다. 그래서 모든 파일에서 사용할 수 있습니다.

참고 : allowJsTypeScript 옵션을 true로 설정 했기 때문에 이것이 작동한다고 생각 합니다.

누군가 순수한 TypeScript 솔루션을 게시하면 동의합니다.

---

이것 만 사용하는 메신저

import {globalVar} from "./globals";
declare let window:any;
window.globalVar = globalVar;

---

global 이것은 미래입니다.

// Way 1
var abc: number
globalThis.abc = 200 // no error

// Way2
declare var age: number
globalThis.age = 18 // no error

참고 : 위의 코드가 포함 된 파일은 어떤 import문도 가질 수 없습니다 .

지금까지 이것이 내가 전역 객체를 확장하기 위해 알아 낸 방법입니다.

모든 마법은 var. 교체 var와 함께 let또는 const작동하지 않습니다.

나는 모듈을 확장하는 노력 globalThis에 의해 선언-병합 했지만 실패했습니다.

---

이것은 내가 그것을 고친 방법입니다.

단계 :

1. 다음과 같이 custom.d.ts와 같은 전역 네임 스페이스를 선언했습니다.

   declare global { namespace NodeJS { interface Global { Config: {} } } } export default global;

2. Map the above created a file into "tsconfig.json" as below:

   "typeRoots": ["src/types/custom.d.ts" ]

3. Get the above created global variable in any of the files as below:

   console.log(global.config)

Note:

1. typescript version: "3.0.1".

2. In my case, the requirement was to set the global variable before boots up the application and the variable should access throughout the dependent objects so that we can get the required config properties.

Hope this helps!

Thank you

---

As an addon to Dima V's answer this is what I did to make this work for me.

// First declare the window global outside the class

declare let window: any;

// Inside the required class method

let globVarName = window.globVarName;

---

I spent couple hours to figure out proper way to do it. In my case I'm trying to define global "log" variable so the steps were:

1) configure your tsconfig.json to include your defined types (src/types folder, node_modules - is up to you):

...other stuff...
"paths": {
  "*": ["node_modules/*", "src/types/*"]
}

2) create file src/types/global.d.ts with following content (no imports! - this is important), feel free to change any to match your needs + use window interface instead of NodeJS if you are working with browser:

/**
 * IMPORTANT - do not use imports in this file!
 * It will break global definition.
 */
declare namespace NodeJS {
    export interface Global {
        log: any;
    }
}

declare var log: any;

3) now you can finally use/implement log where its needed:

// in one file
global.log = someCoolLogger();
// in another file
log.info('hello world');
// or if its a variable
global.log = 'INFO'

참고URL : https://stackoverflow.com/questions/38906359/create-a-global-variable-in-typescript