javascript - 如何在 TypeScript 中為圖片添加路徑別名？

我已經在 tsconfig.json 中配置了 paths。一切運作正常，除了匯入像 svg 和 png 這類的資源檔案。

這是我在 tsconfig.json 中的 paths

{
  "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"

答案＃1

終於解決了。需要添加一些 d.ts 文件。例如：images.d.ts，內容如下：

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

在打開 tsconfig.json 檔案後，將此檔案添加到 include 中：

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

可能，你需要安裝 file-loader。我使用的是 gatsby，所以我不需要配置任何東西

答案＃2

將 "static": ["static/*"] 換成 "static/*": ["static/*"]