Jest : TypeError: require(...) 不是函数

Question

通过发生反应应用程序编写ES6所以import和export语句的应用程序中使用。所以 Jest 被配置为与 ES6 兼容，但是编译的node_modules依赖项导致了一个错误，即

类型错误：require(...) 不是函数

测试开始时。

我认为这是因为 Jest 配置为与 babel-jest 一起处理import语句，但编译代码require用于处理模块。我试图排除node_modules文件夹，但没有任何改变。我认为，ES6 模块使用放置在 node_modules 中的编译模块作为依赖项，因为它不能被排除在外？是否可以？

另外，我有一个问题，了解如何做的玩笑同时处理import，并require在同一时间？如果先编译 ES6 代码，那么每个模块将require在编译过程之后处理。那么问题是什么？

这是配置

开玩笑的配置文件

module.exports = {
  clearMocks: true,
  moduleNameMapper: {
    "^.+\\.(js|jsx)$": "babel-jest",
    "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
      "<rootDir>/mocks/fileMock.js",
    "\\.(css|scss|sass|less)$":
      "<rootDir>/mocks/styleMock.js"
  },
  modulePathIgnorePatterns: [
    "node_modules/"
  ]
};

babel.config.js

/* eslint-disable */
module.exports = {
  presets: [
    "@babel/preset-react",
    [
      "@babel/preset-env",
      {
        targets: {
          browsers: ["ie >= 9", "safari >= 8"]
        }
      }
    ]
  ],
  plugins: [
    ["@babel/plugin-proposal-decorators", { legacy: true }],
    [
      "@babel/plugin-proposal-class-properties",
      { loose: true }
    ],
    "@babel/plugin-proposal-object-rest-spread",
    "@babel/plugin-transform-object-assign",
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-transform-runtime"
  ],
  env:{
    test:{
      plugins: [
        ["@babel/plugin-proposal-decorators", { legacy: true }],
        [
          "@babel/plugin-proposal-class-properties",
          { loose: true }
        ],
        "@babel/plugin-proposal-object-rest-spread",
        "@babel/plugin-transform-object-assign",
        "@babel/plugin-syntax-dynamic-import",
        "@babel/plugin-transform-runtime"
      ]

    }
  }
};

Answer 1

如果您想导入任何文件（例如字体文件），那么只需创建一个只有以下内容的模拟文件

// mockFile.ts or mockFile.js
export default {};

然后在 jest.config.js 中

  moduleNameMapper: {
    '^.+\\.(woff2)$': '<rootDir>/<path to file>/mockFile.ts',
  },

当mockFil尝试导入字体文件时，这将解析为mockFil。您还可以添加其他文件扩展名，例如'^.+\\.(jpg|png|woff2)$: '<rootDir>/<path to file>/mockFile.ts'. 它应该有效。