typescript项目中import 图片时报错:TS2307: Cannot find module ‘...’

这篇具有很好参考价值的文章主要介绍了typescript项目中import 图片时报错:TS2307: Cannot find module ‘...’。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

最近在用typescript写项目时,我用import来加载一个图片,webpack编译文件是会报错如下:
ts2307,bug,1024程序员节,前端
报错:
ts2307,bug,1024程序员节,前端
解决:
  如果在js中引入本地静态资源图片时使用import img from './img/bd_logo1.png’这种写法是没有问题的,但是在typscript中是无法识别非代码资源的,所以会报错TS2307: cannot find module ‘.png’。

因此,我们需要主动的去声明这个module。新建一个ts声明文件如:images.d.ts(如下)就可以了。这样ts就可以识别svg、png、jpg等等图片类型文件。项目编译过程中会自动去读取.d.ts这种类型的文件,所以不需要我们手动地加载他们。当然.d.ts文件也不能随便放置在项目中,这类文件和ts文件一样需要被typescript编译,所以一样只能放置在tsconfig.json中include属性所配置的文件夹下。
ts2307,bug,1024程序员节,前端文章来源地址https://www.toymoban.com/news/detail-609301.html

declare module '*.svg'
declare module '*.png'
declare module '*.jpg'
declare module '*.jpeg'
declare module '*.gif'
declare module '*.bmp'
declare module '*.tiff'

到了这里,关于typescript项目中import 图片时报错:TS2307: Cannot find module ‘...’的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue3 vite ts引入vue文件报错 ts(2307)

    vue3 vite ts 生成的项目模板,在ts文件中引入vue文件报错 ts(2307),只是ts报错,并不影响项目运行。 官方文档有说明:http://vue.dragonlm.com/guide/typescript/overview.html#ide-support 解决方法是安装插件,之后即可正常解析路径,并可以跳转到对应文件。 TypeScript Vue Plugin (Volar)

    2024年02月16日
    浏览(53)
  • Failed to load plugin ‘@typescript-eslint‘ declared in ‘.eslintrc.js‘: Cannot find module ‘typescrip

    今天遇到这个报错搞了一下午,网上百度的很多方法都不适合。现在问题解决了,就把解决方法记录一下。 我是在编译代码(npm run dev)的时候抛出了异常信息,提示自己插件加载失败,找不到对应的模块,介绍下自己的环境,用 vscode+vue2 ,eslint版本 6.8.0 接下来列举下自己

    2024年02月15日
    浏览(56)
  • VSCode 中,TS 提示 ”无法找到 *.vue 声明文件“ 的解决方案,ts(2307)

    github上找到的vue3-admin项目,下载后启动发现vscode总报错 需要配置tsconfig.json tsconfig.json配置 extends了tsconfig.base.json这个文件,其中有两项 这里记得修改成true,否则js中会报错 还有一点也容易忽略,在VSCode中需要设置 1、点击右下角 2、选择

    2024年02月14日
    浏览(37)
  • webstorm vue3+ts报错:Cannot find module ‘@/views/xxx.vue‘ or its corresponding type declarations

    意思是说找不到对应的模块“@/views/xxx.vue”或其相应的类型声明 因为ts只能解析 .ts 文件,无法解析 .vue文件 解决方法很简单,一开始的时候env.d.ts是空文件,我们可以在项目的env.d.ts中引入如下代码: 加入上面的代码,就不报错了。

    2024年02月11日
    浏览(67)
  • vue3.2+ts错误:找不到模块“./App.vue”或其相应的类型声明。ts(2307)

    vue3.2+ts错误:找不到模块“./App.vue”或其相应的类型声明。ts(2307)   解决方法: 在项目根目录创建 env.d.ts 文件(如果已有,则在文件中追加),加入以下内容: 报错原因: 未定义 .vue文件的类型,导致 ts 无法解析其类型,在env.d.ts中定义后即可解决。

    2024年02月11日
    浏览(54)
  • vscode报错:找不到模块“vue”或其相应的类型声明。ts(2307)

    https://www.xjx100.cn/news/187714.html?action=onClick vue3 setup + ts + vite 项目问题解决:Cannot find module ... or its corresponding type declarations.(ts2307)_cannot find module \\\'vue-router\\\' or its correspondi_喵喵喵更多的博客-CSDN博客 重点:Ctrl+Shift+P 唤起命令面板,配置 volar 的 typescript版本

    2024年02月21日
    浏览(42)
  • TypeScript配置-- 2. 了解ts配置项,根据vite项目了解typescript配置文件,tsconfig.json、tsconfig.node.json、

    仅对于Ts项目来说,产生红色波浪线,主要是由于语法错误,当然也有其他情况… 这边先引入一个greeter.ts文件 发现居然没有跟一些项目一样,有红色的波浪线,不是说了函数里面的参数是需要显示追加类型的吗。 tsconfig.json 不知道有什么配置项?鼠标悬浮试试~~ 具体可以看

    2024年02月03日
    浏览(42)
  • idea的maven多模块项目启动时报错:Could not find artifact或者错误找不到符号

    1、问题描述: 多个项目中遇到idea的多模块maven项目,在启动的时候会报错: 【Could not find artifact,找不到包】 或者 【错误:找不到符号(但明明代码不报红)】 但是在别人的idea上却能正常启动。 2、解决方法: (1)原因说明: 后来发现,项目启动时,idea会自动调用mav

    2024年02月17日
    浏览(57)
  • 解决拉取Vue项目报错Cannot find module ‘webpack/lib/RuleSet‘

    第一步:将 package-lock.json和node_modules包删除 第二步:删除webpack,重装了老的版本。 npm uninstall webpack npm install webpack@^4.0.0 --save-dev 如果不删除重装会报以下错误的 第三步:运行如果还不成功报这个错误 就屏蔽掉这个代码,就好啦

    2024年02月03日
    浏览(72)
  • 基于vue3+ts+vite的项目使用‘unplugin-auto-import/vite’插件,自动全局导入api的注意事项

    ​  1.首先安装插件 npm install unplugin-auto-import @vitejs/plugin-vue -D 2.安装完成后在vite.congfig.ts中配置,红色部分就是关于插件的基础自动导入部分,这样就可以将vue和router的相关api全局导入了, import AutoImport from \\\"unplugin-auto-import/vite\\\" export default defineConfig({   plugins: [     vue(),  

    2023年04月12日
    浏览(60)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包