找不到模块-在NextJS中导入svgs

Question

我正在将inline-react-svg插件与babel结合使用，以便在NextJS中导入内联SVG。

那是我的.babelrc文件

{
  "presets": ["next/babel"],
  "plugins": [
    "inline-react-svg",
    [
      "import", {
        "libraryName": "antd",
        "style": true
      }
    ]
  ]
}

而且，由于我使用的是TypeScript，因此我必须声明与图像扩展相关的模块。

这是在项目根目录@types文件夹中声明的模块

declare module '*.png'
declare module '*.jpg'
declare module '*.jpeg'
declare module '*.gif'
declare module '*.svg'

但是我无法导入任何SVG文件，因为TypeScript找不到该模块。

不适用于绝对导入，但适用于相对路径"../../public/images/icons/go-back-arrow.svg"

Answer 1

这是之间的已知兼容性问题 babel-plugin-module-resolver和babel-plugin-inline-react-svg

引用：Next.js typescript import aliases with babel-plugin-module-resolver

解决此问题的PR尚未合并https://github.com/airbnb/babel-plugin-inline-react-svg/pull/17