下一个图像的类型定义

Question

我正在使用 NextJs 和 next-images 的打字稿。代码是：

import css from "./style.sass";
import img from './logo.svg';
import Link from 'next/link';

export default () => <Link href="/">
        <img src={img} className={css.logo}/>
    </Link>;

如果没有输入，则会显示此错误：

Cannot find module './logo.svg'.ts(2307)

目前我使用以下类型 (typings.ts):

declare module "*.svg" {
    const value: string;
    export default value;
}

declare module "*.png" {
    const value: string;
    export default value;
}

declare module "*.jpg" {
    const value: string;
    export default value;
}

使用这些 typings.ts 文件应该可以解决错误，但事实并非如此。有人在使用时遇到同样的错误吗？有没有更好的方法来编写 typings.ts 文件？

Answer 1

经过数小时的尝试和错误，我找到了解决方案。我不得不将 typings.ts 移动到 src/ 目录并将其重命名为 images.d.ts

此处解释：https://webpack.js.org/guides/typescript/#importing-other-assets

如果能回答如何以更通用的方式编写类型，那将是一件好事。

Answer 2

2020 年更新：

下一个图像包现在支持 TypeScript。

你需要做的就是在next-env.d.ts

中添加定义

https://github.com/twopluszero/next-images#typescript

下一个图像的类型定义

Type definitions for next-images

typescript

next.js