it-roy-ru.com

Невозможно импортировать файлы SVG в машинописи

В файлах TypeScript(*.tsx) я не могу импортировать файл svg с этим утверждением:

import logo from './logo.svg';

Transpiler говорит: [ts] cannot find module './logo.svg'.Мой файл SVG просто <svg>...</svg>.

Но в файле .js я могу импортировать его без проблем с точно таким же оператором импорта. Я предполагаю, что это как-то связано с типом файла SVG, который должен быть каким-то образом установлен для TS Transpiler. 

Не могли бы вы поделиться, как заставить это работать в файлах TS?

34
AngryBoy

Если вы используете веб-пакет, вы можете сделать это, создав файл пользовательских типов. 

Создайте файл с именем custom.d.ts со следующим содержимым:

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

Источник: https://webpack.js.org/guides/TypeScript/#importing-other-assets

56
Graham

Спасибо smarx за указание на использование require(). Так что в моем случае это должно быть:

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

который отлично работает в * .tsx файлах

18
AngryBoy

Есть альтернативный способ сделать это, который мы реализовали: сделать ваши SVG-компоненты. Я сделал это, потому что мне показалось, что я использую операторы commonJS require вместе с моими imports.

0
endymion1818