Currently, I am working on a React application that utilizes TypeScript and webpack. I am aware that in TypeScript, when importing an image file, it is necessary to create a d.ts file in the current directory and include the following code:
// index.d.ts
declare module "*.png" {
const value: string;
export default value;
}
The structure of my project directory looks like this:
-- container
-- Header
-- Navigator
avatar.png
index.tsx
-- Banner
headerGround.png
index.tsx
Having to write a d.ts file in every directory each time I want to import a PNG file has become quite tedious for me. Is there any alternative way to address this issue? Any suggestions or solutions would be greatly appreciated. Thank you.