首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >类型记录和响应(使用Gatsby加载程序):无法将图像作为模块导入

类型记录和响应(使用Gatsby加载程序):无法将图像作为模块导入
EN

Stack Overflow用户
提问于 2019-12-11 08:29:29
回答 1查看 2.6K关注 0票数 7

首先,我不认为盖茨比有问题,因为在运行盖茨比的tsc -p .之前,运行yarn start将检测到相同的编译错误。

我有一个文件夹,里面有我想编译的一些react文件。

代码语言:javascript
运行
复制
src/
  @types/
    index.d.ts
  components/
    bottom/bottom.tsx
    layout.tsx
  images/
    email.png
    costs.png 
gatsby-config.js
gatsby-node.js
tsconfig.json
package.json

我希望bottom.tsx加载email.png,但是我有这个错误

如这篇文章所写,我在src/@types/index.d.ts中将所有图片声明为模块。我已经在这个文件中创建了一个用于测试的接口,编译器正确地读取了该文件。

代码语言:javascript
运行
复制
declare module '*.jpg';
declare module '*.png';​

export interface Thing {
    name: string
}

使用导入作为或向模块声明添加内容不会改变任何事情。但是,如果忽略类型记录编译器,则代码运行良好:

代码语言:javascript
运行
复制
//@ts-ignore
import email from '../../images/email.png'
//@ts-ignore
import logo from '../../images/logo-bw.png'

它的工作,所以代码的结构是好的盖茨比,但显然我失去了很多好处使用打字稿,因为图像是一个网站的一个很大的一部分.此外,没有IDE自动完成来帮助图像导入。

这个Gatsby初学者是开源的,所以您可以在这个分支中检查配置:https://github.com/robusta-code/gatsby-the-robust/tree/0.0.1

请注意,加载css或sass模块是可以的:import '../styles/home.scss'

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-12-11 09:51:54

哇..。问题是我的index.d.ts正在导出一个接口!

在TypeScript中,就像在ECMAScript 2015中一样,任何包含顶级导入或导出的文件都被视为模块。相反,没有任何顶级导入或导出声明()的文件被视为一个脚本,其内容在全局范围中可用(因此也适用于模块)。

去除export interface Thing{}就足够了。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59281568

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档