使用 TypeScript 导入 SVG 文件时出现类型错误

当我尝试如下方式导入 svg 文件时，出现 Cannot find module '../../images/twitter.svg' 类型错误。TypeScript | Webpack 文档中有类似的描述，是通过创建 SVG 文件的类型，告诉编译器正常处理 TypeScript 文件以外的任何内容。

import SVGTwitter from "../../images/twitter.svg" // Cannot find module '../../images/twitter.svg' or its corresponding type declarations. ts(2307)

怎么办

1. custom.d.ts 创建定义 TS 以外的类型的文件
   如下所示创建一个文件，custom.d.ts并在那里定义 svg 的扩展类型。

   // custom.d.ts
     
   declare module '*.svg' {
     const content: any;
     export default content;
   }
   

2. tsconfig.json读取创建的类型文件

   // tsconfig.json
    
   {
     "include": ["./src/**/*", "src/custom.d.ts"]
   }
   

参考

Importing Other Assets - TypeScript | Webpack