如何在TypeScript中添加图像的路径别名?

Question

我已经在tsconfig.json中配置了paths。一切工作正常，除了导入资产文件如svg和png。

这是我的paths在tsconfig.json

{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@components/*": ["./src/components/*"],
"@components": ["./src/components"],
"@app/*": ["./src/app/*"],
"static": ["static/*"]
},
...
}

下面是我如何导入:

import imageAdd from "static/images/image-add.png";
import circleIcon from "static/icons/circle-close.svg"

Answer 1

将"static": ["static/*"]替换为"static/*": ["static/*"]

Answer 2

终于解决了。需要添加一些d.ts文件。如。images.d.tswith content:

declare module "*.png";
declare module "*.jpg";

转到tsconfig.json文件并将此文件添加到include:

"include": ["images.d.ts", <other includes>]

你可能需要安装file-loader。我使用gatsby，所以我不需要配置任何东西