Jest 中可以处理带问号的导入吗？

Question

在 JS/Webpack/Jest 项目中，我尝试使用以下语法导入 SVG 文件：

import imageUrl from './image.svg?url

（这种风格是 SVGR 在其文档中推荐的。）

但是，当我尝试运行测试时，我遇到了 Jest 的问题：

● Test suite failed to run

    Cannot find module './image.svg?url' from 'src/components/Home/Home.jsx'

    Require stack:
      src/components/Home/Home.jsx
      src/components/App.jsx
      src/components/App.test.jsx

      3 | import ErrorBoundary from '../ErrorBoundary';
      4 | import Loading from '../Loading';
    > 5 | import imageUrl from './image.svg?url'

我尝试配置

jest.config.ts

来支持这些导入，例如与：

 transform: {
    '.+\\.(css|css!|styl|less|sass|scss|png|jpg|ttf|woff|woff2|svg\\?url)$': 'jest-transform-stub',

但这没有任何效果。

Answer 1

我让它与 Jest 配置一起使用：

  moduleNameMapper: {
    '^(.+\\.svg)(\\?\\w+)$': '$1',

此问题已在

https://github.com/pd4d10/vite-plugin-svgr/issues/97 中讨论