解决typescript + react + url-loader 找不到图片问题

最近自己在撸一个小项目，基于react + react-router + typescript + mobx + axios 的一个购物车网站。在登陆页面想添加一个漂亮小姐姐作为引导（其实就是皮，三玖天下第一）

但是在引用本地图片的时候，报错

[ts] 找不到模块“../../../public/images/san.jpeg”。
复制代码

在网上找了很多文章，终于用蹩脚的英语在google上找到了答案和解决方法（google大法好啊 T.T）。

只在typescript中。ts、js文件是相关的,如果你试着从文件导入xxx.png,typescript就不知道如何处理它,Webpack配置不使用ts。 所以我们要把图片格式以申明为模块

• 首先添加文件 images.d.ts 并添加如下代码

declare module '*.svg'
declare module '*.png'
declare module '*.jpg'
declare module '*.jpeg'
declare module '*.gif'
declare module '*.bmp'
declare module '*.tiff'
复制代码

• 然后 在图片引入的地方使用*读取并且重命名

import * as loginImg from '../../../public/images/san.jpeg';
复制代码

这样vsCode就不报错，并且可以启动项目了！！！

这样漂亮（wo）小（lao）姐姐（po）就显示出来了

简直猛男落泪啊！！！

感谢大佬的文章

github.com/Microsoft/T…

stackoverflow.com/questions/3…

如果各位大神有别的解决方法也希望告诉小老弟我，嘿嘿。

转载于:https://juejin.im/post/5c5f87c36fb9a049dd80c0d3