延遲模塊加載如何在打字稿中工作？

在此typescript book section作者解釋了延遲加載與下面的例子：延遲模塊加載如何在打字稿中工作？

import foo = require('foo'); 

export function loadFoo() { 
    // This is lazy loading `foo` and using the original module *only* as a type annotation 
    var _foo: typeof foo = require('foo'); 
    // Now use `_foo` as a variable instead of `foo`. 
}

據筆者打字稿只加載的foo在第一次調用類型require，但在第二次調用時會創建一個foo變種它會加載創建var _foo所需的全部模塊。

這是如何工作的。可有人告訴什麼是引擎蓋下發生的情況更詳細的例子嗎？

來源

2017-04-13 Ole

它在typescript handbook

編譯器檢測在所發射的 JavaScript的每個模塊是否被使用提及。如果模塊標識符只使用過的作爲一種類型的註釋的一部分，並且從不作爲表達，則沒有需要呼叫是該模塊射出。

在這個例子中，第一foo（一個沒有下劃線）在類型的註釋作爲typeof參數只使用一次，所以第一個require('foo')從生成的JavaScript代碼刪去。您可以查看生成的.js文件看到，有將只有一個調用require在runtine，「第二」之一。

當loadFoo()被調用時，require('foo')執行，調用內置的node.js，加載在運行時以通常的方式foo模塊require()功能。

來源

2017-04-13 01:44:52 artem

打字稿2.4現在支持Dynamic Import Expressions在那裏你可以懶洋洋地導入模塊。

這裏是例子

async function getZipFile(name: string, files: File[]): Promise<File> { 
const zipUtil = await import('./utils/create-zip-file'); 
const zipContents = await zipUtil.getContentAsBlob(files); 
return new File(zipContents, name);

}

它依然使用「規定」，你可以在transpiled code here

看到幕後的背後

來源

2018-01-05 12:48:56

延遲模塊加載如何在打字稿中工作？

回答

相關問題