首先,我不认为盖茨比有问题,因为在运行盖茨比的tsc -p .
之前,运行yarn start
将检测到相同的编译错误。
我有一个文件夹,里面有我想编译的一些react文件。
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
中将所有图片声明为模块。我已经在这个文件中创建了一个用于测试的接口,编译器正确地读取了该文件。
declare module '*.jpg';
declare module '*.png';
export interface Thing {
name: string
}
使用导入作为或向模块声明添加内容不会改变任何事情。但是,如果忽略类型记录编译器,则代码运行良好:
//@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'
发布于 2019-12-11 09:51:54
哇..。问题是我的index.d.ts
正在导出一个接口!
在TypeScript中,就像在ECMAScript 2015中一样,任何包含顶级导入或导出的文件都被视为模块。相反,没有任何顶级导入或导出声明()的文件被视为一个脚本,其内容在全局范围中可用(因此也适用于模块)。
去除export interface Thing{}
就足够了。
https://stackoverflow.com/questions/59281568
复制相似问题