在 Typescript 中导入 React 图像

Question

我已经使用 typescript 和 react 以及我自己的 webpack 配置设置了我自己的 react 项目。因此，我做错了什么或没有做错什么，我不知道是什么。

我的问题是我无法导入我的图片。

我尝试了这些指南中的解决方案，但无济于事：https://medium.com/better-programming/how-to-display-images-in-react-dfe22a66d5e7

我的设置如下：

src > 资产/组件/主题 index.tsx custom.d.ts

assets > img > Logo.png

components > components & App.tsx 的不同文件夹

Index.tsx 和 custom.d.ts 彼此相邻。

在我的 webpack 配置中，我有这个：

{
   test: /\.(png|svg|jpg|jpeg|gif)$/i,
   type: 'asset/resource',
}

在我的 custom.d.ts 文件中，我有这个：

declare module '*.jpg'
declare module '*.png'
declare module '*.jpeg'
declare module '*.gif'

我正在尝试像这样导入文件：import Logo from '../../assets/img/Logo'

我收到此错误：找不到模块 '../../assets/img/Logo' 或其对应的类型声明.ts(2307)

如果您需要更多信息，请告诉我。

谢谢！

Answer 1

你的配置中有asset/resource，但说你的结构是assets/img，尝试在你的配置中将asset更改为assets，或者创建路径asset/resource。