Typescript編譯器忘記將文件擴展名添加到ES6模塊導入？

我想編譯一個Typescript項目到JS與ES6模塊分辨率，但似乎不正確。Typescript編譯器忘記將文件擴展名添加到ES6模塊導入？

我tsconfig.json看起來是這樣的：

{ 
    "compilerOptions": { 
    "module": "es6", 
    "target": "es6", 
    "sourceMap": true, 
    "lib": ["es6"] 
    } 
}

我建立一個簡單的測試案例只有兩個模塊。第一個模塊（module1.ts）只是出口恆定：

export const testText = "It works!";

第二個模塊（main.ts）只是進口從第一模塊的出口：

import { testText } from 'module1'; 
alert(testText);

輸出（main.js）包含在我的index.html與type="module"-屬性：

<script src="main.js" type="module"></script>

當我用Firefox（dom.moduleScripts.enabled在about：config中設置）和Chrome Canary（實驗性Web平臺標誌設置）測試此項時。在這兩種情況下，它都不起作用。

Typescript編譯器似乎將TS import { testText } from 'module1'; -statement轉換爲JS語句import { testText } from 'module1';。（注：這兩個是完全一樣的）

正確ES6進口語句應該是： import { testText } from 'module1.js'; （注意.js文件擴展名）如果我手動添加文件擴展名來生成的代碼，它的工作原理。

我做錯了什麼或Typescript "module": "es6"設置不正確？有沒有辦法以這樣的方式配置tsc：將.js文件擴展名添加到生成的導入語句中？

來源

2017-07-07 Chaos156

這是一個已知的問題，報告爲https://github.com/Microsoft/TypeScript/issues/13422和https://github.com/Microsoft/TypeScript/issues/16577 – artem

我正在解決同樣的問題。導入'* .js'文件是很好的解決方法，但後來我遇到了IDE（使用CLion）重構和去聲明，定義等問題。所以我切換回導入時沒有'* .js'擴展名，實際上我是使用SystemJS來轉換ES6 JavaScript（作爲開發過程中的臨時解決方案）。我找到了關於使用TypeScript編譯器[API]（https：// github。COM /微軟/打字稿/維基/使用最編譯器API）。爲這種情況考慮「定製」構建工具，但實際上我很忙。如果任何人有一些想法，筆記或有像t的東西 – Martin

這是一個bug in TypeScript。

在短期內，你可以解決它通過指定輸出文件：

在main.ts指定.js擴展名和路徑：

import { testText } from './module1.js'; 
alert(testText);

這將正確地拿起module.ts，但輸出與包括.js擴展。

請注意，您還需要爲本地文件添加前綴./，因爲「裸」模塊名稱保留供將來使用。

來源

2017-08-29 08:49:53 Keith

Typescript編譯器忘記將文件擴展名添加到ES6模塊導入？

回答

相關問題