"在反应应用程序中使用反应测试渲染器和故事书执行组件测试时出错"

Question

我在做故事书教程<\/a>，但是在我创建和运行测试时的教程部分中，这会引发异常，指示文件.storybook\/config.js<\/strong>中出现以下错误：

日志错误<\/strong>

react-scripts test
FAIL src/storybook.test.js
Test suite failed to run

TypeError: require.context is not a function

  2 | import "../src/index.css";
  3 |
> 4 | const req = require.context("../src", true, /\.stories.js$/);
    |                     ^
  5 |
  6 | function loadStories() {
  7 |   req.keys().forEach(filename => req(filename));

  at Object.context (.storybook/config.js:4:21)
  at configure (node_modules/@storybook/addon-storyshots/dist/frameworks/configure.js:38:11)
  at Object.load (node_modules/@storybook/addon-storyshots/dist/frameworks/react/loader.js:26:26)
  at loadFramework (node_modules/@storybook/addon-storyshots/dist/frameworks/frameworkLoader.js:31:17)
  at testStorySnapshots (node_modules/@storybook/addon-storyshots/dist/api/index.js:53:36)
  at Object.<anonymous> (src/storybook.test.js:2:1)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        6.812s
Ran all test suites related to changed files.

Answer 1

您应该使用requireContext而不是require.context ：

将包添加到开发依赖项：

yarn add --dev require-context.macro

并在配置中导入并使用它，您的配置应该类似于 gthis：

import { configure } from "@storybook/react";
import requireContext from 'require-context.macro';

import "../src/index.css";

const req = requireContext('../src', true, /\.stories\.js$/);

function loadStories() {
  req.keys().forEach(filename => req(filename));
}

configure(loadStories, module);

Answer 2

运行这一行： yarn add --dev require-context.macro