babel-jest не обрабатывает ES6 в модулях
Я пытаюсь настроить Jest на основе проекта React, который использует модули ES6. Однако у меня, похоже, проблемы с модулями ES6, я использую babel-jest и считаю, что у меня это настроено правильно (Jest обнаруживает это автоматически).
Jest, похоже, не имеет проблем с использованием импорта ES6, однако, как только он попадает в оператор импорта в одном из импортированных модулей, он задыхается. Это похоже на транспонирование только начального тестового сценария, а не какого-либо из импортированных модулей. Я пробовал различные конфигурации и пытался искать Google без успеха. Запуск тестов без импорта работает нормально.
здесь ошибка:
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import Predications from './predications';
^^^^^^
SyntaxError: Unexpected token import
вот соответствующие биты конфигурации:
шутку.conf.в JSON
{
"testRegex": "/test/spec/.*.js$",
}
.babelrc
{
"presets": ["es2015", "stage-0", "react"]
}
тестовый скрипт
import React from 'react';
import { mount, shallow } from 'enzyme';
import Slider from 'react-slick';
import Carousel from '../../client/components/carousel/carousel.js'; // test chokes on when I include this module
describe('carousel component', () => {
it('is a test test case', () => {
expect(1 + 2).toEqual(3);
});
});
обновление:
как было предложено, я попытался запустить тест без шутку.conf.js, однако testRegex необходим чтобы Jest нашел мои тесты, я попытался переместить тесты в каталог тестов по умолчанию, и они все еще терпят неудачу.
Я хотел бы уточнить, что сами тесты работают нормально, проблема, похоже, в том, где один из моих импортированных модулей использует ES6, в моем примере выше, если я не импортирую свой компонент карусели, тест работает нормально, как только я импортирую, что тест подавляется инструкцией импорта в этом файле. Кажется, что импортированные модули не получают transpiled.
обновление #2
после определенных розыскных мероприятий выясняется, проблема в том, что Бабель не transpiling ES6 в пределах папки node_modules. Я создал пример репо, чтобы продемонстрировать это здесь: https://github.com/jamiedust/babel-jest-example
Я понимаю, что сторонние модули должны обрабатывать свои собственные транспилирования, однако у нас есть ряд модулей, которые размещаются в нашем собственном реестре npm и повторно используются между проекты, в этих случаях Webpack обрабатывает транспилирование, для тестов Jest нам нужно, чтобы эти node_modules были транспилированы Babel или способ использования нашего webpack, настроенного для этого для нас.
решение
добавьте следующую конфигурацию в пакет.JSON (или конфигурационный файл Jest).
"jest": {
"transformIgnorePatterns": [
"/node_modules/(?!test-component).+.js$"
]
}
4 ответов
по умолчанию код node_modules
игнорируется babel-jest
, см. параметр конфигурации Jest transformIgnorePatterns
. Я также создал PR на вашем примере РЕПО, так что вы можете видеть это работает.
хотя это работает, я обнаружил, что это очень медленно в реальных приложениях, которые имеют много зависимостей, содержащих модули ES. Кодовая база Jest имеет несколько иной подход к этому, как вы можете найти в "babel-jest преобразование зависимостей" (извините, не буду публиковать более 2 url). Это также может занять гораздо больше времени в Windows, см. "взятие 10 секунд на пустом РЕПО".
Если делать "модульное" тестирование, издевательство, вероятно, лучший способ пойти.
вы можете попробовать добавить плагин transform-es2015-modules-commonjs в файл конфигурации babel только для тестирования. Вот пример файла конфигурации, который говорит babel транспилировать модули только в среде тестирования. Вы можете поместить его под ваши пресеты:
{
"presets": [
"react",
["es2015", {"modules": false, "loose": true}]
],
"env": {
"test": {
"plugins": ["transform-es2015-modules-commonjs"]
}
}
}
Вы можете прочитать о плагине здесь:
https://www.npmjs.com/package/babel-plugin-transform-es2015-modules-commonjs
затем, при запуске тестов Jest на в командной строке укажите NODE_ENV=test (возможно, Вам понадобится добавить флаг --no-cache в команду в первый раз после внесения изменений в конфигурацию babel, потому что Jest кэширует вывод babel, но после этого вы можете оставить его:
NODE_ENV=test jest --no-cache
я узнал об этом на семинаре React Брайана Холта в Frontend Masters. https://frontendmasters.com/courses/
я столкнулся с той же проблемой (node_module не транспилирован babel-jest), не будучи в состоянии решить ее.
вместо этого я, наконец, преуспел, насмехаясь над node_module, как описано здесь https://facebook.github.io/jest/docs/manual-mocks.html
NB: установка издевается в __mocks__
вложенные папки не работали для меня. Поэтому я передал макет как второй параметр
еще одна возможная причина. Вавилон теперь игнорирует ваши .babelrc внутри node_modules и использует тот, который предоставляется зависимостью. Если у вас есть контроль над зависимостью, вам нужно будет добавить a .babelrc к нему, и babel будет использовать эти настройки для него.
Это может вызвать проблемы, если ваша зависимость и ваш проект используют разные версии babel или модули.