Jest — Не удается найти модуль ‘react-hot-loader’

#jestjs #react-hot-loader

#jestjs #react-hot-loader

Вопрос:

Я написал интеграционный тест с использованием Jest:

 import 'jest-styled-components';
import React from 'react';
import { remAuto } from 'tidee-life-theme';
test('blah', () => {});
  

и я получаю этот странный вывод:

  Cannot find module 'react-hot-loader' from 'core.js'

       7 | const core = {
       8 |     'background-color': '#fff',
    >  9 |     'color': fontColor,
         |                                                      ^
      10 |     'font-family': fontFamily,
      11 |     'font-family-bold': fontFamilyBold,
      12 |     'font-size': fontSize,

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:221:17)
      at ../tidee-life-theme/src/core.js:9:91
      at Object.<anonymous> (../tidee-life-theme/src/core.js:11:3)
  

Когда я смотрю на core.js , там нет ссылки на react-hot-loader :

 export const fontColor = "#666";
export const fontFamily = `'open_sansregular', helvetica, arial`;
export const fontFamilyBold = `'open_sansbold', helvetica, arial`;
export const fontSize = 13;
export const fontLineHeight = 17 /13;

const core = {
    'background-color': '#fff',
    'color': fontColor,
    'font-family': fontFamily,
    'font-family-bold': fontFamilyBold,
    'font-size': fontSize,
    'line-height': fontLineHeight,
};

export default core;
  

Я использую lerna и tidee-life-theme он находится в пакете, смежном с тем, в котором выполняется тест.
Итак, что же здесь происходит?

Комментарии:

1. Импортируете ли вы свой компонент, завернутый в горячую перезагрузку, в свой тест?

2. Нет, это не так. Я пока вообще не удосужился импортировать какие-либо компоненты. utils.js Файл, который я импортирую, просто содержит вспомогательные функции для стилизованных компонентов.

3. Проверьте наличие специальных символов в core.js. Ваша проблема — настоящая загадка.

4. Спасибо за предложение, но я проверил, и там нет специальных символов.

Ответ №1:

В React-Hot-Loader есть плагин babel, который будет добавлять require('react-hot-loader') к каждому файлу. Так что — даже если вы его не видите — он может быть там.

Решение — отключить плагин react-hot-loader для jest (или включить только для web).

Есть разные способы сделать это. Самый простой — добавьте его через babel-loader параметры конфигурации в вашем webpack.conf и удалите из .babelrc .

Комментарии:

1. Есть ли какая-либо документация для этого? Я удалил 'react-hot-loader/babel' из plugins раздела babel.config.js , но я не уверен, что делать с моими конфигурационными файлами webpack?