วิธีใช้ typescript กับสัญญา ES6 ดั้งเดิม


121

ฉันเป็นผู้เริ่มต้นใช้งาน typescript โดยสมบูรณ์และฉันสงสัยว่าจะสามารถใช้สัญญา ES6 ใน typescript ได้หรือไม่และฉันจะต้องทำอย่างไรเพื่อให้มันใช้งานได้ ฉันกำลังใช้งานโหนด 0.11.14 และได้รับข้อผิดพลาดระหว่างการรวบรวม "ไม่พบชื่อ 'สัญญา'"


1
สัญญายังไม่อยู่ในโหนดคุณต้องมีแพ็คเกจลองes6-promise
elclanrs

คำตอบ:


128

lib.d.ts ปัจจุบันไม่มีสัญญาที่กำหนดไว้ดังนั้นคุณต้องมีไฟล์นิยามพิเศษสำหรับมันนั่นคือสาเหตุที่คุณได้รับข้อผิดพลาดในการคอมไพล์

ตัวอย่างเช่นคุณสามารถใช้ (เช่น @elclanrs กล่าวว่า) ใช้แพ็คเกจ es6 กับไฟล์คำจำกัดความจากDefinelyTyped : คำจำกัดความ es6

จากนั้นคุณสามารถใช้งานได้ดังนี้:

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

แก้ไขคุณสามารถใช้งานได้โดยไม่ต้องกำหนดเป้าหมายเมื่อกำหนดเป้าหมาย ES6 (ด้วยคอมไพเลอร์ TypeScript) - โปรดทราบว่าคุณยังต้องการให้ Promise มีอยู่ในรันไทม์ของหลักสูตร (ดังนั้นจะใช้ไม่ได้ในเบราว์เซอร์เก่า :)) เพิ่ม / แก้ไขสิ่งต่อไปนี้ใน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-promiseและtsc --initคำสั่งติดตั้ง npm แรกจะเปลี่ยนของคุณpackage.jsonเพื่อรวม es6-สัญญาเป็นการอ้างอิง tsc --init จะสร้างtsconfig.jsonไฟล์ สำหรับคุณ.

ตอนนี้คุณสามารถใช้สัญญาในไฟล์ typescript ของคุณvar x: Promise<any>;ได้แล้ว ดำเนินการtsc -p .เพื่อรวบรวมโครงการของคุณ คุณไม่ควรมีข้อผิดพลาด


5
ขอบคุณมาก Dick van den Brink! ทำงานหลังจากแบบสอบถาม tsd es6-สัญญา - การติดตั้งการดำเนินการ
บันทึก

3
โปรดทราบว่า typescript v1.7.x กำหนดไฟล์นิยามสัญญา es6 ที่ 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

ใช้ตัวเลือกtargetและlibคอมไพเลอร์เพื่อคอมไพล์โดยตรง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

ใช้ในการติดตั้ง NPMes6-shimจากองค์กรประเภท

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

ทางเลือก # 3

ก่อน typescript 2.0 ใช้typingsการติดตั้งes6-shimทั่วโลกจากDefinitelyTyped

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

typingsตัวเลือกที่ใช้npmในการติดตั้งtypingsทั่วโลกแล้วใช้typingsในการติดตั้งชิม dt~คำนำหน้าหมายถึงการดาวน์โหลดชิมจาก DefinitelyTyped --globalตัวเลือกหมายความว่าประเภทชิมที่จะสามารถใช้ได้ตลอดโครงการ

ดูสิ่งนี้ด้วย

https://github.com/Microsoft/TypeScript/issues/7788 - ไม่พบชื่อ 'Promise' & ไม่พบชื่อ 'ต้องการ'


2
การรวมes2016ไม่ใช่ความคิดที่ดีเว้นแต่ว่าเป้าหมายของคุณจะรองรับ ES2016 มีเบราว์เซอร์จำนวนมากที่รองรับคำสัญญา แต่ไม่ใช่ทุกอย่างใน ES2016 ใช้es2015.promiseเพื่อรวมเฉพาะประเภทสำหรับสัญญาโดยไม่ต้องดึงประเภทสำหรับทุกอย่างใน ES2016
paldepind

23

ใน TypeScript 2.0 คุณสามารถรวมการพิมพ์สำหรับคำสัญญาดั้งเดิมโดยรวมสิ่งต่อไปนี้ไว้ในไฟล์ tsconfig.json

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

ซึ่งจะรวมถึงการประกาศสัญญาที่มาพร้อมกับ TypeScript โดยไม่ต้องตั้งเป้าหมายเป็น ES6


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/…
Plantain Yao

สิ่งนี้จะใช้ไม่ได้หากคุณวางแผนที่จะรองรับ IE คุณจะได้รับ 'ข้อผิดพลาดทางไวยากรณ์' ในเบราว์เซอร์เมื่อเรียกใช้
RoninCoder

12

นี่เป็นวิธีล่าสุดในการทำเช่นนี้คำตอบข้างต้นล้าสมัย:

typings install --global es6-promise


การพิมพ์มีอยู่แล้วในบางครั้ง แต่ TypeScript 2.0 จะอนุญาตให้ติดตั้งไฟล์นิยามโดยตรงจาก npm (ดังนั้นคุณไม่จำเป็นต้องใช้เครื่องมือเพิ่มเติมเช่นการพิมพ์) อัปเดตโพสต์ของฉันด้วยข้อมูลเมื่อ TypeScript 2.0 พร้อมใช้งาน
Dick van den Brink

3
เราได้รับข้อผิดพลาดต่อไปนี้: พยายามคอมไพล์ "es6-Promise" เป็นโมดูลส่วนกลาง แต่ดูเหมือนโมดูลภายนอก คุณจะต้องลบตัวเลือกส่วนกลางเพื่อดำเนินการต่อ
Shaun Luttin

ตอนนี้วิธีล่าสุดคือ: npm install @ type / es6-สัญญา
Berty

นี่ไม่ใช่วิธีล่าสุดอีกต่อไป TypeScript มาพร้อมกับประเภทสำหรับ Promises นอกกรอบ ไม่จำเป็นต้องติดตั้งอะไร ดูคำตอบของฉัน
paldepind

5

การใช้สัญญา ES6 ดั้งเดิมกับ typescript ใน Visual Studio 2015 + เครื่องมือ Node.js 1.2

ไม่จำเป็นต้องติดตั้ง npm เนื่องจาก ES6 Promises เป็นแบบเนทีฟ

โครงการ 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"และ TypeScript เวอร์ชันต่ำกว่า 2.0:

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

ฉันต้องดาวน์เกรด@types/core-jsเป็น 9.36 เพื่อให้มันทำงานกับ"target": "es5"set ใน tsconfig ของฉัน

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

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.