Jest + Typescript + Абсолютные пути (baseUrl) выдает ошибку: Не удается найти модуль - PullRequest
Новая
       17

Jest + Typescript + Абсолютные пути (baseUrl) выдает ошибку: Не удается найти модуль

0 голосов
/ 04 мая 2018

Я устанавливаю конфигурацию для запуска моих тестов в приложении для создания сценариев create-реагировать-приложение + (, из которого я извлек ). Я использую Jest + энзим. В моем tsconfig.json я установил baseUrl='./src', поэтому я могу использовать абсолютные пути при импорте модулей. Например, это типичная инструкция импорта в одном из моих файлов: 

import LayoutFlexBoxItem from 'framework/components/ui/LayoutFlexBoxItem';

Вы видите, что путь абсолютный (из папки / src), а не относительный. Это работает нормально, когда я работаю в режиме отладки (yarn start)

Но когда я запускаю свой тест (yarn test), я получаю эту ошибку: 

 Cannot find module 'framework/components/Navigation' from 'index.tsx'

Похоже, что jest не может разрешить этот абсолютный путь, хотя я настроил его в своем файле tsconfig.json. Это мой tsconfig.json: 

{
  "compilerOptions": {
    "outDir": "dist",
    "module": "esnext",
    "target": "es5",
    "lib": ["es6", "dom"],
    "sourceMap": true,
    "allowJs": true,
    "jsx": "react",
    "moduleResolution": "node",
    "rootDir": "src",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "baseUrl": "./src"    
  },
  "exclude": [
    "node_modules",
    "build",
    "dist",
    "config",    
    "scripts",
    "acceptance-tests",
    "webpack",
    "jest",
    "src/setupTests.ts"
  ]
}

Теперь я вижу, что в корне моего проекта есть сгенерированный tsconfig.test.json. Это конфигурация ts, используемая для теста. И вот его содержание: 

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "module": "commonjs"
  }
}

Как видите, «модуль» здесь равен commonjs, тогда как в конфигурации по умолчанию это esnext. Может ли это быть одной из причин?

Кто-нибудь смог протестировать свой машинописный проект с помощью Jest и абсолютного пути? или это известная ошибка? Поскольку я извлек из конфигурации по умолчанию, есть ли какие-то настройки, которые нужно добавить в конфигурацию моего веб-пакета?

Спасибо за ваш вклад и предложение.

Ответы [ 8 ]

0 голосов
/ 27 июня 2019

Как указывалось здесь, moduleNameMapper в jest.config.js необходимо определить пути, указанные в tsconfig.json. Например, если у вас есть пути в tsconfig.json, определенные следующим образом 

// tsconfig.json
{
 ...
 "baseUrl": "src",
 "paths": {
    "@alias/*": [ 'path/to/alias/*' ]
 }
 ...
}

тогда ваш jest.config.js должен предоставить эти пути в moduleNameMapper в следующем формате: 

// jest.config.js
module.exports = {
    'roots': [
        '<rootDir>/src'
    ],
    'transform': {
        '^.+\\.tsx?$': 'ts-jest'
    },
    'moduleNameMapper': {
         '@alias/(.*)': '<rootDir>/src/path/to/alias/$1'
    }
};

Имея это, мы можем улучшить наш jest.config.js для автоматического преобразования путей, определенных в tsconfig.json. Вот для этого фрагмент кода : 

// jest.config.js

function makeModuleNameMapper(srcPath, tsconfigPath) {
    // Get paths from tsconfig
    const {paths} = require(tsconfigPath).compilerOptions;

    const aliases = {};

    // Iterate over paths and convert them into moduleNameMapper format
    Object.keys(paths).forEach((item) => {
        const key = item.replace('/*', '/(.*)');
        const path = paths[item][0].replace('/*', '/$1');
        aliases[key] = srcPath + '/' + path;
    });
    return aliases;
}

const TS_CONFIG_PATH = './tsconfig.json';
const SRC_PATH = '<rootDir>/src';

module.exports = {
    'roots': [
        SRC_PATH
    ],
    'transform': {
        '^.+\\.tsx?$': 'ts-jest'
    },
    'moduleNameMapper': makeModuleNameMapper(SRC_PATH, TS_CONFIG_PATH)
};
0 голосов
/ 31 января 2019

мое решение было, 

  "jest": {
    "moduleDirectories": [
      "node_modules",
      "src"
    ],
    "moduleFileExtensions": [
      "js",
      "json",
      "ts"
    ],
    "roots": [
      "src"
    ],
    "testRegex": ".spec.ts$",
    "transform": {
      "^.+\\.(t|j)s$": "ts-jest"
    },
    "coverageDirectory": "../coverage",
    "testEnvironment": "node",
    "moduleNameMapper": {
      "src/(.*)": "<rootDir>/src/$1"
    }
  }
0 голосов
/ 21 июня 2019

ts-jest может решить эту проблему отлично!
https://kulshekhar.github.io/ts-jest/user/config/#paths-mapping
просто измените jest.config.js следующим образом: 

    const { pathsToModuleNameMapper } = require('ts-jest/utils');
    const { compilerOptions } = require('./tsconfig.json');
    module.exports = {
        preset: 'ts-jest',
        moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths)
    }
0 голосов
/ 25 сентября 2018

У меня была похожая проблема. Я надеюсь, что это может помочь сэкономить время для некоторых из вас.

Моя проблема:

  • используя приложение create-реагировать с машинописью
  • использование абсолютных путей (src / MyComp) для импорта компонентов внутри других компонентов (например, App.tsx)
  • он работал над компиляцией / запуском / сборкой
  • не работает на тесте

Я обнаружил, что ошибка произошла из-за другого значения NODE_PATH. Поэтому я установил его на тестовые прогоны.

Я воссоздал проблему и исправил ее здесь: https://github.com/alessandrodeste/...

Я не уверен, может ли это вызвать побочные эффекты на тестах. Дайте мне знать, если у вас есть обратная связь;)

0 голосов
/ 28 августа 2018

Я использую React с Typescript, я удалил react-scripts-ts test --env=jsdom из npm test и добавил jest --watch в качестве теста по умолчанию после того, как добавил jest.config.js в свой проект, следуя этим инструкциям https://basarat.gitbooks.io/typescript/docs/testing/jest.html

и я использовал конфигурацию, упомянутую @Antonie Laffargue (свойство add / edit moduleDirectories: ['node_modules', 'src']), она отлично работает.

0 голосов
/ 30 июля 2018

Вот как у меня работает moduleNameMapper.

С приведенным ниже конфигом в моем tsconfig: 

    "paths": {
      "@App/*": [
        "src/*"
      ],
      "@Shared/*": [
        "src/Shared/*"
      ]
    },

Вот модуль NameMapper: 

"moduleNameMapper": {
  "@App/(.*)": "<rootDir>/src/$1",
  "@Shared/(.*)": "<rootDir>/src/Shared/$1"
}
0 голосов
/ 04 июля 2018

Я боролся с той же проблемой, и на самом деле оказалось, что простое изменение, похоже, помогает.

Я только что обновил поле moduleDirectories в jest.config.js

До 

moduleDirectories: ['node_modules']

* После 1013 *

moduleDirectories: ['node_modules', 'src']

Надеюсь, это поможет,
Antoine

0 голосов
/ 04 мая 2018

Вы, вероятно, хотите moduleNameMapper особенность конфигурации Jest. Это сопоставит ваши пользовательские пространства имен импорта с реальными местоположениями модулей.

см. Официальную документацию здесь:

https://facebook.github.io/jest/docs/en/configuration.html#modulenamemapper-object-string-string

...