#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?