Не удается найти модуль @ ionic / angular (ionic 4) из тестового файла

Question

Я пытаюсь использовать jest для тестирования ионного приложения.Моя шутливая конфигурация:

preset: 'jest-preset-angular',
setupTestFrameworkScriptFile: '<rootDir>/src/setupJest.ts',
transformIgnorePatterns: ['node_modules/(?!@ngrx|@ionic-native|@ionic)'],
globals: {
  __TRANSFORM_HTML__: true,
},

Файл setupJest.js содержит import 'jest-preset-angular';.

У меня очень простой тест, в котором я использую TestBed для создания экземпляра компонента App и проверкичто это правда.В этом коде у меня есть import { Platform } from '@ionic/angular';.

Jest ошибок с:

Cannot find module '@ionic/angular' from 'app.component.test.ts'

Если я просто удаляю import { Platform } from '@ionic/angular' изтестовый файл, Jest выдает мне ту же ошибку из файла компонента:

Cannot find module '@ionic/angular' from 'app.component.ts'

Используя ionic serve / строительные работы, Jest просто дает мне эту ошибкучто он не может импортировать X из Y.

Как я могу заставить jest импортировать из @ionic файлов?

Answer 1

npm install --save rxjs-compat or do
npm update

Answer 2

Мне удалось решить эту проблему из информации в связанной проблеме GitHub.Я пришел к заключительным конфигурациям, связанным здесь: https://github.com/ionic-team/ionic/issues/15695#issuecomment-428412641

С тех пор, как я изменил эти конфигурации, чтобы ускорить тесты (с кешем) и до сих пор не столкнулся с проблемами.Мои текущие конфигурации:

// jest.config.js
module.exports = {
  globals: {
    // jest-preset-angular sets ts-jest tsConfigFile as "src/tsconfig.spec.json". This overwrites
    // it to use the default `tsconfig.json`. You can change this to your preferred config.
    __TRANSFORM_HTML__: true,
  },
  preset: 'jest-preset-angular',
  setupTestFrameworkScriptFile: '<rootDir>/src/setupJest.ts',
  moduleNameMapper: {
    '^@ionic/core/loader': '<rootDir>/node_modules/@ionic/core/dist/esm/es5/ionic.define.js',
  },
  transformIgnorePatterns: [
    '<rootDir>/node_modules/(?!@ionic)',
  ],
};

src/setupJest.ts включает только import 'jest-preset-angular'.

Конфигурация TypeScript:

{
  "compilerOptions": {
    "allowJs": true,
    "target": "esnext",
    "module": "commonjs",
    "moduleResolution": "node",
    "declaration": false,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "skipLibCheck": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"]
  }
}

Вероятно, вы можете изменить некоторые из этих параметров конфигурации довольнонемного, но самый важный - allowJs. требуется , иначе jest не сможет должным образом импортировать многие библиотеки Ionic.

Наконец, не забудьте импортировать из /ngx с файлами Ionic 4.Например:

import { StatusBar } from '@ionic-native/status-bar/ngx';