节点模块 .d.ts 下的文件的 Jest 测试失败，即使忽略节点模块也无法解析

Question

我在进行笑话测试时遇到以下错误。我已经对错误发布到的节点模块进行了转换忽略。请检查配置并帮助我编译我的测试用例

尝试了 moduleNameMapper 和 TransformIgnorePatterns 但没有成功 还添加了 babel 配置

错误：

    Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax.

    Out of the box Jest supports Babel, which will be used to transform your files into valid JS based on your Babel configuration.

    By default "node_modules" folder is ignored by transformers.

    Here's what you can do:
     • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/ecmascript-modules for how to enable it.
     • If you are trying to use TypeScript, see https://jestjs.io/docs/getting-started#using-typescript
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/configuration
    For information about custom transformations, see:
    https://jestjs.io/docs/code-transformation

    Details:

    C:\projectName\node_modules\@ms\centr-loader\dist\loader\index.js:7
    export { initialize, preloadFeature, bootstrapFeature } from './foreignEnvLoader';
    ^^^^^^

    SyntaxError: Unexpected token 'export'

      2 | import { Stack, DetailsListLayoutMode, StackItem } from '@fluentui/react';
      3 | import { Dropdown } from '@fluentui/react/lib/Dropdown';
    > 4 | import { DataGrid, Loading } from '@fluentui/react';
        | ^

      at Runtime.createScriptFromCode (../node_modules/jest-runtime/build/index.js:1505:14)

jest.config.ts

// Jest.config.ts
import type { Config } from 'jest';

const config: Config = {
  testEnvironment: 'jsdom',
  setupFilesAfterEnv: ['<rootDir>/support/setupTests.ts'],
  moduleFileExtensions: ["js", "jsx", "tsx", "ts", "mjs", "mjx", "json", "node"],
  preset: 'ts-jest',
  moduleNameMapper: {
    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga|mjs|ms|mjx)$': '<rootDir>/__mocks__/fileMock.js',
    '\\.(css|less)$': 'identity-obj-proxy'
  },
  testRegex: "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?|mjs?|mjx?)$",
  transform: {
    '^.+\\.(ts|tsx)$': 'ts-jest',
    '^.+\\.(js|jsx|mjs|ms|mts)$': 'babel-jest',
    "^.+\\.m?jsx?$": "babel-jest"
  },
  transformIgnorePatterns: [
    '!<rootDir>/node_modules/'
  ],
};

export default config;

tsconfig.json

{
  "compilerOptions": {
    "target": "esnext",
    "useDefineForClassFields": true,
    "lib": [
      "DOM",
      "DOM.Iterable",
      "esnext"
    ],
    "allowJs": false,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "module": "commonjs",
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": false,
    "noEmit": true,
    "jsx": "react",
    "types": [
      "jest"
    ]
  },
  "include": [
    "src",
    "test"
  ],
  "references": [
    {
      "path": "./tsconfig.node.json"
    }
  ]
}

.babelrc

{
    "env": {
        "test": {
            "presets": [
                [
                    "@babel/preset-env",
                    {
                        "modules": false
                    }
                ]
            ],
            "plugins": [
                [
                    "@babel/plugin-transform-modules-commonjs",
                    {
                        "spec": true
                    }
                ]
            ]
        }
    }
}

Answer 1

尝试将

transformIgnorePatterns

修改为这个

const transformedModules = [
  '@fluentui/react'
].join('|');

const config: Config = {
  ...,
  transformIgnorePatterns: [`node_modules/(?!(${transformedModules})/)`],
};

每当特定节点模块弹出此错误时，请将其名称添加到

transformedModules

数组