네이티브 ES6 약속과 함께 Typescript를 사용하는 방법


121

저는 Typescript의 완전한 초보자이며 Typescript에서 ES6 promise를 사용할 수 있는지, 그리고 그것들이 작동하도록하려면 무엇을해야하는지 궁금합니다. 노드 0.11.14를 실행 중이며 컴파일 중에 " 'Promise'이름을 찾을 수 없습니다."라는 오류가 발생합니다.


1
약속은 당신이하려고하는 패키지가 필요, 아직 노드에없는es6-promise
elclanrs

답변:


128

현재 lib.d.ts에는 약속이 정의되어 있지 않으므로 추가 정의 파일이 필요하므로 컴파일 오류가 발생합니다.

예를 들어 @elclanrs가 말한 것과 같이 DefinitelyTyped의 정의 파일과 함께 es6-promise 패키지를 사용할 수 있습니다 .es6-promise definition

그런 다음 다음과 같이 사용할 수 있습니다.

var p = new Promise<string>((resolve, reject) => { 
    resolve('a string'); 
});

편집 ES6 (TypeScript 컴파일러 사용)를 대상으로 할 때 정의없이 사용할 수 있습니다. tsconfig.json:

"compilerOptions": {
    "target": "ES6"
}

편집 2 TypeScript 2.0이 나오면 약간 변경되지만 (위는 여전히 작동하지만) 정의 파일은 아래와 같이 npm으로 직접 설치할 수 있습니다.

npm install --save @types/es6-promise- 소스

edit3 유형 사용에 대한 자세한 정보로 답변 업데이트.

내용 package.json으로 만 파일을 생성합니다 { }(package.json이 아직없는 경우 호출 npm install --save @types/es6-promisetsc --init. 첫 번째 npm install 명령은 package.jsones6-promise를 종속성으로 포함하도록 변경합니다 . tsc --init는 tsconfig.json파일 을 생성 합니다. 당신을 위해.

이제 typescript 파일에서 promise를 사용할 수 있습니다 var x: Promise<any>;. tsc -p .프로젝트를 컴파일하기 위해 실행 하십시오. 오류가 없어야합니다.


5
많은 감사합니다 Dick van den Brink! 최대와 TSD 쿼리 ES6-약속 한 후 실행하는 --save 설치 --action
dchang

3
Typescript v1.7.x는 C : \ Program Files (x86) \ Microsoft Visual Studio 12.0 \ Common7 \ IDE \ CommonExtensions \ Microsoft \ TypeScript \ lib.es6.d.ts
diegohb

2
나는 @Kokodoko와 동일한 문제가 있다고 생각합니다-내 package.json은 첫 번째 진술 이후에 업데이트되었지만 Intellisense에서 선택되지 않았습니다 (VS를 사용하고 있습니다) .VS Intellisense 문제처럼 보이지만 트랜스 파일 및 실행됩니다. ... 이것에 대한 어떤 아이디어? 이미 패키지 복원 / 설치를 시도했지만 차이가 없었습니다.
rumblefx0

2
안녕하세요. 라이브러리는 컴파일 타임에만 사용되므로 --save-dev대신 플래그를 사용해야 한다고 생각합니다 --save.
mrr

2
이것은 구식입니다. 대상을 ES6으로 설정하거나 타이핑 파일을 설치할 필요가 없습니다. 아래 내 대답을 참조하십시오.
paldepind

50

대안 # 1

사용 targetlib직접 컴파일 컴파일러 옵션을 es5를 설치 할 필요없이 es6-shim. (TypeScript로 테스트 됨 2.1.4). lib 섹션에서 es2016또는 es2015.promise.

// tsconfig.json
{
    "compilerOptions": {
        "target": "es5",
        "lib": [
            "es2015.promise",
            "dom"
        ]
    },
    "include": [
        "src/**/*.ts"
    ],
    "exclude": [
        "node_modules"
    ]
}

대안 # 2

NPM을 사용es6-shim 하여 유형 조직 에서 설치 합니다 .

npm install @types/es6-shim --save-dev

대안 # 3

TypeScript 2.0 이전에는 타이핑 을 사용하여 DefinitelyTyped 에서 es6-shim전역으로 설치합니다 .

npm install typings --global --save-dev
typings install dt~es6-shim --global --save-dev

typings옵션을 사용하여 npm설치 typings전 세계적으로 다음 사용 typings심의를 설치합니다. dt~접두사는 DefinitelyTyped에서 심의를 다운로드하는 것을 의미합니다. 이 --global옵션은 프로젝트 전체에서 shim의 유형을 사용할 수 있음을 의미합니다.

또한보십시오

https://github.com/Microsoft/TypeScript/issues/7788- 'Promise'이름을 찾을 수 없으며 'require'이름을 찾을 수 없습니다.


2
포함 es2016은 대상이 ES2016을 지원하지 않는 한 좋은 생각이 아닙니다. 약속을 지원하는 많은 브라우저가 있지만 ES2016의 모든 것은 아닙니다. es2015.promiseES2016의 모든 유형에 대해 유형을 가져 오지 않고 약속 유형 만 포함하는 데 사용 합니다.
paldepind

23

TypeScript 2.0부터는 다음을 포함하여 네이티브 약속에 대한 타이핑을 포함 할 수 있습니다. tsconfig.json

"compilerOptions": {
    "lib": ["es5", "es2015.promise"]
}

여기에는 대상을 ES6으로 설정하지 않고도 TypeScript와 함께 제공되는 promise 선언이 포함됩니다.


3
이것이 최선의 답이라고 생각합니다. 컴파일 대상을 변경하거나 모든 es2015 타이핑을 가져올 필요가 없습니다.
Ethan

새 브라우저 만 지원할 때 사용하는 옵션입니다. IE10 또는 이전 Android 장치 지원이 필요한 경우 여전히 polyfill이 필요합니다.
Dick van den Brink

13

node.js 0.12 이상 / typescript 1.4 이상을 사용하는 경우 다음과 같은 컴파일러 옵션을 추가하십시오.

tsc a.ts --target es6 --module commonjs

추가 정보 : https://github.com/Microsoft/TypeScript/wiki/Compiler-Options

을 사용하는 tsconfig.json경우 다음과 같이하십시오.

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es6"
    }
}

추가 정보 : https://github.com/Microsoft/TypeScript/wiki/tsconfig.json


실제로 commonjs와 es6를 함께 사용할 수 없습니다.
Adrian Ber

3
@AdrianBer 사실 당신은 할 수 있습니다. github.com/Microsoft/TypeScript/wiki/...
질경이 야오

IE를 지원할 계획이면 작동하지 않습니다. 브라우저를 실행할 때 브라우저에 '구문 오류'가 표시됩니다.
RoninCoder

12

이것은 가장 최근의 방법이며 위의 답변은 구식입니다.

typings install --global es6-promise


타이핑은 이미 꽤 오랫동안 존재하지만 TypeScript 2.0은 npm에서 직접 정의 파일을 설치할 수 있습니다 (따라서 타이핑과 같은 추가 도구가 필요하지 않습니다). TypeScript 2.0을 사용할 수있게 될 때 정보로 내 게시물을 업데이트했습니다.
Dick van den Brink

3
다음 오류가 표시됩니다. "es6-promise"를 전역 모듈로 컴파일하려고 시도했지만 외부 모듈처럼 보입니다. 계속하려면 전역 옵션을 제거해야합니다.
Shaun Luttin 2016-07-05

지금 가장 최근의 방법입니다 : 유형 @ 설치 NPM / --save ES6은 - 약속
Berty

이것은 더 이상 가장 최근의 방법이 아닙니다. TypeScript는 Promise에 대한 유형과 함께 제공됩니다. 아무것도 설치할 필요가 없습니다. 내 대답을 참조하십시오.
paldepind

5

Visual Studio 2015 + Node.js 도구 1.2에서 Typescript와 함께 네이티브 ES6 약속 사용

ES6 Promises가 기본이므로 npm 설치가 필요하지 않습니다.

Node.js 프로젝트 -> 속성-> Typescript 빌드 탭 ECMAScript 버전 = ECMAScript6

import http = require('http');
import fs = require('fs');

function findFolderAsync(directory : string): Promise<string> {

    let p = new Promise<string>(function (resolve, reject) {

        fs.stat(directory, function (err, stats) {

            //Check if error defined and the error code is "not exists"
            if (err && err.code === "ENOENT") {
                reject("Directory does not exist");
            }
            else {
                resolve("Directory exists");
            }
        });

    });
    return p;
}

findFolderAsync("myFolder").then(

    function (msg : string) {
        console.log("Promise resolved as " + msg); 
    },
    function (msg : string) {
        console.log("Promise rejected as " + msg); 
    }
);

5

A. "target": "es5"2.0 이하의 TypeScript 버전을 사용하는 경우 :

typings install es6-promise --save --global --source dt

B. "target": "es5"TypeScript 버전 2.0 이상을 사용하는 경우 :

"compilerOptions": {
    "lib": ["es5", "es2015.promise"]
}

C.를 사용하는 경우 "target": "es6"아무것도 할 필요가 없습니다.


4
"target": "es6"TypeScript 2.1.1과 함께 사용 하고 있으며 여전히 Cannot find name 'Promise'.
zakdances

-1

내 tsconfig에서 세트 @types/core-js로 작동하려면 9.36 으로 다운 그레이드 해야했습니다 "target": "es5".

"@types/core-js": "0.9.36",

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.