React JS项目配置Jest遇意外令牌错误，求解决提示

这个错误的核心是：Jest默认跳过node_modules目录的代码转译，但axios v1.x版本使用了ES模块语法（import），Jest无法直接解析未转译的ES模块代码。

修复步骤 #

1. 修改jest.config.js里的transformIgnorePatterns配置，让Jest对axios进行转译：

module.exports = {
    testEnvironment: 'jsdom',
    testMatch: ['**/__tests__/**/*.js?(x)', '**/?(*.)+(spec|test).js?(x)'],
    moduleNameMapper: {
        '\.(css|less|scss|sss|styl)$': '<rootDir>/node_modules/jest-css-modules',
        '\.(gif|ttf|eot|svg)$': '<rootDir>/__mocks__/fileMock.js',
    },
    setupFilesAfterEnv: ['<rootDir>/src/setupTests.js'],
    transform: {
        '^.+\.js$': 'babel-jest'
    },
    // 修改这一行，排除axios不被忽略
    transformIgnorePatterns: ['<rootDir>/node_modules/(?!axios)'],
};

这里的(?!axios)是正则负向预查，意思是node_modules里除了axios，其他包都跳过转译。

2. （可选）如果问题仍存在，给babel.config.js的@babel/preset-env添加适配Jest环境的配置：

module.exports = {
    presets: [
        ['@babel/preset-env', { targets: { node: 'current' } }],
        '@babel/preset-react'
    ]
};

3. 重新运行npm run test验证问题是否解决。

补充 #

如果之后其他第三方包也出现类似ES模块语法错误，都可以用同样方法，把包名加到排除列表里，比如(?!axios|react-paginate)。

内容的提问来源于stack exchange，提问作者Dominika Es