Я не уверен, что происходит, но у меня есть настройка jest
для использования TypeScript. Это прекрасно работает. Кроме того, у меня есть настройка storybook
для использования TypeScript. Это прекрасно работает. Но когда я пытаюсь использовать storyshots
с TypeScript, у меня возникают проблемы. Мой код TypeScript выглядит так:
● Test suite failed to run
ReferenceError: React is not defined
at Object.<anonymous> (src/widgets/generic.tsx:18:28)
at Object.<anonymous> (src/widgets/index.ts:1:25)
at Object.<anonymous> (src/browser/render.tsx:7:23)
at Object.<anonymous> (src/browser/shell.tsx:5:10)
at Object.<anonymous> (src/browser/api.tsx:3:33)
at Object.<anonymous> (src/browser/index.ts:1:23)
at Object.<anonymous> (stories/shell.tsx:3:15)
at newRequire (node_modules/@storybook/addon-storyshots/dist/require_context.js:73:14)
at loadStories (evalmachine.<anonymous>:7:5)
at ConfigApi.configure (node_modules/@kadira/storybook/dist/client/preview/config_api.js:93:9)
at evalmachine.<anonymous>:12:26
at runWithRequireContext (node_modules/@storybook/addon-storyshots/dist/require_context.js:102:3)
at testStorySnapshots (node_modules/@storybook/addon-storyshots/dist/index.js:100:35)
at Object.<anonymous> (test/alt.ts:2:18)
Что странно, так это то, что должно быть найдено React
. Файл, на который там делается ссылка, имеет в качестве первой строки:
import React = require('react');
Любые идеи, что может происходить?
Хорошо, простой ответ здесь заключается в том, что настройка для allowSyntheticDefaultImports
должна быть false
в tsconfig.json
. Почему? Я действительно не знаю.
Но всем, кто интересуется использованием Storybook и StoryShots с Jest и TypeScript, эта статья может оказаться полезной . В основном это показывает все небольшие препятствия, с которыми я столкнулся, пока это работает, а также то, как их преодолеть. Я также создаю образец репо .
Наткнулся на это случайно. ts-jest
по умолчанию использует babel для переноса модулей, если для allowsyntheticdefaultimports
установлено значение true, и если это не отражено в конфигурации веб-пакета вашего сборника рассказов, у вас возникнут проблемы.
(я сопровождаю ts-jest
)
@GeeWee , спасибо за разъяснение. У меня все заработало, и я добавил в эту статью оговорку, чтобы отразить свой опыт: https://medium.com/@mtiller/storybook -react-typescript-and-jest-c9059ea06fa7
Самый полезный комментарий
Хорошо, простой ответ здесь заключается в том, что настройка для
allowSyntheticDefaultImports
должна бытьfalse
вtsconfig.json
. Почему? Я действительно не знаю.Но всем, кто интересуется использованием Storybook и StoryShots с Jest и TypeScript, эта статья может оказаться полезной . В основном это показывает все небольшие препятствия, с которыми я столкнулся, пока это работает, а также то, как их преодолеть. Я также создаю образец репо .