นำเข้ามอดูลแบบไดนามิกใน TypeScript
วิธีการของ TypeScript ในการโหลดโมดูลแบบไดนามิก (เมื่อทราบเส้นทางของโมดูลในขณะรันไทม์) คืออะไร? ผมได้ลองใช้วิธีนี้แล้ว:
var x = "someplace"
import a = module(x)
แต่ดูเหมือนว่าคอมไพเลอร์ TypeScript จะต้องการเห็น path เป็นสตริงใน import/module เวลาแปลโค้ด:
tsc test.ts
/tmp/test.ts(2,19): error TS1003: Identifier expected.
/tmp/test.ts(2,20): error TS1005: ';' expected.
ฉันรู้ว่าฉันสามารถใช้ RequireJS ได้โดยตรงเป็นตัวอย่าง (ถ้าฉันใช้รูปแบบโมดูล amd) แต่ฉันรู้สึกว่านั่นไม่ถูกต้องสำหรับฉัน - มันเป็นวิธีแก้ปัญหาสำหรับไลบรารีหนึ่งเท่านั้น
คำตอบ #1
การนำเข้าแบบไดนามิกของข้อเสนอ ES ได้รับการสนับสนุนตั้งแต่ TypeScript 2.4 เอกสารถูกจัดเก็บไว้ที่นี่
ฟังก์ชัน import เป็นแบบอะซิงโครนัสและส่งกลับ Promise
var x = 'someplace';
import(x).then((a) => {
// `a` is imported and can be used here
});
หรือใช้ async/await:
async function run(x) {
const a = await import(x);
// `a` is imported and can be used here
}
คำตอบ #2
คุณต้องระบุสตริงแบบกำหนดค่าโดยตรง ตัวแปรจะใช้ไม่ได้
อัปเดต
ตอนนี้ JavaScript มีการนำเข้าที่ไดนามิกแล้ว ดังนั้นคุณสามารถทำ import(x) :https://developers.google.com/web/updates/2017/11/dynamic-import
TypeScript รองรับสิ่งนี้เช่นกัน อย่างไรก็ตามคุณยังคงต้องการให้ตัวแปรเป็นไปได้ที่จะวิเคราะห์แบบสถิติเพื่อความปลอดภัยของประเภท เช่น
const x = 'someplace';
import(x).then((a) => { // TypeScript knows that `x` is 'someplace' and will infer the type of `a` correctly
});
