Typescript errors when using a suffix (?raw, ?url etc

Question

I get a typescript error in my vite project when I try to import an SVG with a suffix (?component). How can I configure typescript to ignore these suffixes?

TS2307: Cannot find module './desktop-mark.svg?component' or its corresponding type declarations.

import DesktopLogoMark from './desktop-mark.svg?component';

This was the only way I could get the SVG imports to work. Here is the post: https://stackoverflow.com/questions/70309561/unable-to-import-svg-with-vite-as-reactcomponent — Carl Wirkus, Jan 12 '22 at 14:21

score 3 · Accepted Answer · answered Jan 12 '22 at 14:21

3

You need to add module declaration: https://www.typescriptlang.org/docs/handbook/modules.html#wildcard-module-declarations

answered Jan 12 '22 at 14:21

Алексей Мартинкевич

1,777
6
6

thanks, this works: ``` declare module "*?component" { const content: string; export default content; } ``` – Carl Wirkus Jan 12 '22 at 14:24

Typescript errors when using a suffix (?raw, ?url etc

1 Answers1