jest-preset-angular 不适用于 Angular 13 和 ESM 模块

jest-preset-angular not working with Angular 13 and ESM module

我正在使用带有 jest 的 ESM 模块,并且在使用 angular 12 jest-preset-angular 进行编译时,通过在排除列表中列出 @igniteui 对我来说效果很好。我升级到 Angular 13,以及下一个版本的 jest-preset-angular,但我现在无法让它工作。在帮助页面之后,我尝试使用这个:

require('jest-preset-angular/ngcc-jest-processor')

module.exports = {
    preset: 'jest-preset-angular/presets/defaults-esm',
    moduleFileExtensions: ['ts', 'html', 'js', 'json', 'mjs'],
    resolver: 'jest-preset-angular/build/resolvers/ng-jest-resolver.js',
    transformIgnorePatterns: [
        "node_modules/(?!@igniteui|tslib|.*\.mjs$)"
    ],
    transform: {
        '^.+\.(ts|js|mjs|html|svg)$': 'jest-preset-angular'
    },
    setupFilesAfterEnv: ['<rootDir>/setup-jest.ts']
}

当我 运行 开玩笑时,它说找不到 igniteui 模块。这是我在旧版本中使用的 jest.config.js:

require('jest-preset-angular/ngcc-jest-processor')

module.exports = {
    preset: 'jest-preset-angular/presets/defaults-esm',
    globals: {
        'ts-jest': {
            useESM: true,
            tsconfig: '<rootDir>/tsconfig.spec.json',
            stringifyContentPathRegex: '\.html$'
        }
    },
    testTimeout: 20000,
    transformIgnorePatterns: [
        "node_modules/(?!@igniteui|tslib)"
    ],
    setupFilesAfterEnv: ['<rootDir>/setup-jest.ts']
}

我终于通过这样做让它工作了:

require('jest-preset-angular')

module.exports = {
    preset: 'jest-preset-angular/presets/defaults-esm',
    transformIgnorePatterns: [
        "node_modules/(?!@igniteui|@infragistics|tslib)"
    ],
    moduleFileExtensions: ['ts', 'html', 'js', 'json', 'mjs'],
    setupFilesAfterEnv: ['<rootDir>/setup-jest.ts']
}

对于那些给您带来错误导入错误的库,将它们添加到 transformIgnorePatters。你只需要前缀。因此,例如,我使用 @infragistics/igniteui-angular 但我只添加了 @infragistics.