無法導入SVG文件中的打字稿

在typescript(*.tsx)文件，我無法導入SVG文件有這樣的說法：無法導入SVG文件中的打字稿

import logo from './logo.svg';

Transpiler說：[ts] cannot find module './logo.svg'. 我的SVG文件只是<svg>...</svg>。

但在.js文件中，我可以導入它沒有任何問題與完全相同的導入語句。我想這與svg文件的類型有關，它必須以某種方式設置爲ts transpiler。

你可以請分享如何使這項工作在ts文件？

2017-06-23 AngryBoy

SVG文件不是JavaScript和如JavaScript模塊無法使用。您應該使用http請求來加載這些文件。 – toskv

你在使用Webpack嗎？這是我見過的唯一一件能夠理解這種「進口」聲明的東西。也許Webpack是什麼在你的JavaScript中允許這樣做，但它在TypeScript文件中並沒有這麼做。（我認爲TypeScript本身不知道該怎麼做。） – smarx

如果您使用的是Webpack，您可能需要分享您的Webpack配置才能獲得更多幫助。 – smarx

謝謝smarx指出使用require()。所以在我的情況下，它應該是：

const logo = require("./logo.svg") as string;

其作品在* .tsx文件

2017-06-23 10:12:39 AngryBoy

如果您使用的WebPack罰款，你可以通過創建一個自定義類型的文件做到這一點。

創建一個文件名爲custom.d.ts具有以下內容：

declare module "*.svg" { 
    const content: any; 
    export default content; 
}

2017-08-25 18:15:58 Graham

可能需要將它添加到_tsconfig.json_中的'include'部分。 –

回答