Jest的transformIgnorePatterns无法正常工作

Question

我已经花了很长时间查看其他与此相关的问题以及在Github上查看其他项目，但是没有一个答案对我起作用。

我正在将第三方库加载到我的项目中，在运行Jest测试时出现错误

export default portalCommunication;
^^^^^^

SyntaxError: Unexpected token export

> 1 | import portalCommunication from 'mathletics-portal-communication-service';

我尝试了多种方式更新我的Jest配置来使它转译这个库，但是我总是得到相同的错误。

这是我的当前jest.config.js文件:

module.exports = {
    moduleNameMapper: {
        '\\.(css|scss)$': 'identity-obj-proxy',
        '\\.svg$': '<rootDir>/test/mocks/svg-mock.js'
    },
    setupFiles: ['./test/test-setup.js'],
    transformIgnorePatterns: [
        '<rootDir>/node_modules/(?!mathletics-portal-communication-service)'
    ]
};

我也尝试添加transform属性，以便对mathletics-portal-communication-service目录运行babel-jest。

请帮忙！

- Heather Roberts

---

您可能需要配置 Babel。 - Tomasz Mularczyk

我的项目已经设置好并且使用babel也很顺利，但是我需要为Jest做一些特殊的配置吗？我以为它会自动使用babel-jest？ - Heather Roberts

请参考相关问题：链接。 - Akaisteph7

Answer 1

transformIgnorePatterns 对我不起作用，直到我将我的 .babelrc 改为 babel.config.js，像这样：

module.exports = {
    "presets": [
        "@babel/preset-env"
    ]
};

根据这条评论所述：https://github.com/facebook/jest/issues/6229#issuecomment-403539460

- NJCodeMonkey

---

你知道是否绝对需要一个.babelrc或者babel.config.js文件吗？我试图只用在我的package.json中声明transformIgnorePatterns来让我的Babel工作。 - Yorkshireman

看了一下链接的 Github 问题，似乎在 package.json 中也行不通，但我还没有尝试过。 - NJCodeMonkey

这个回复真是被低估了！！我一直在撞墙几个小时，直到看到这个！这应该被写进文档里！ - Samuel Imolorhe

很奇怪，.babelrc不起作用，而babel.config.js却可以。 - Alec Gerona

谢谢，你节省了我的时间！ - Chaolong Liao

Answer 2

我们机构的另一个团队添加了一些常用模块。这些模块没有被转译，因此出现了问题。

我遵循了这个链接：https://babeljs.io/docs/en/configuration#whats-your-use-case

1. 我将我的 .babelrc 转换成 babel.config.json
2. 在 jest 配置中添加了这个内容： transformIgnorePatterns: ['/node_modules/(?!(@companyName)/).*/'],

这解决了我的问题。

- Rohan Bagchi

---

我看到有人说要将这个添加到package.json中... 嗯，非常感谢！ - Akaisteph7

谢谢您！这在 Babel 文档中是一个微妙的细节，但（显然）除非您有一个 babel.config.json 文件，否则 Babel 不会编译您的 node_modules。在我看来，这是非常意外的行为，但至少我已经让它工作了。 - undefined

Answer 3

目前的解决方法是，我已经更改了我的配置文件，使用moduleNameMapper选项来加载该库的模拟类。我本来更喜欢使用transformIgnorePatterns，所以仍然希望能得到任何想法。

新的配置：

module.exports = {
    moduleNameMapper: {
        '\\.(css|scss)$': 'identity-obj-proxy',
        '\\.svg$': '<rootDir>/test/mocks/svg-mock.js',
        'mathletics-portal-communication-service': '<rootDir>/test/mocks/mathletics-portal-communication-service-mock.js'
    },
    setupFiles: ['./test/test-setup.js']
};

- Heather Roberts

---

这也是我这种情况下唯一有效的方法。 - Rafael Steil

Answer 4

在我的情况下，添加斜杠解决了这个问题：

{
    // ...
    transformIgnorePatterns: [
        '<rootDir>/node_modules/(?!mathletics-portal-communication-service/)'
    ]
};

- Raz Luvaton

Answer 5

可能是你使用了rootDir。请尝试：

    "transformIgnorePatterns": [
      "node_modules/(?!(mathletics-portal-communication-service))"
    ]

- Yorkshireman