如何使用webpack手动测试反应组件？

Question

我知道我们应该对reactjs组件使用单元测试。但我还想要的是单独手动测试我们的组件。因为我们正在处理小型sprint，我们必须在首先使用该组件的页面之前提供一些已完成的组件。我希望看到完整的组件真正起作用（即测试与css和子组件的集成）。

首先，我希望看到在黑色页面中呈现的新组件不会直接require该组件，而是从查询字符串参数中获取该组件名称/路径。然后我计划在该页面添加一些通用组件配置（例如，一个文本框，其中json表示要传递给该组件的道具）。

我现在面临的第一个问题是如何配置webpack，webpack-dev-middleware或webpack-dev-server以便能够加载由参数传递的组件。

任何人都知道怎么做？或者更好的方法来解决这个问题？

Answer 1

我会尝试这样的事情：

1. 设置使用require.context。
的入口点
2. 根据您的查询字符串在该上下文中调用require。你现在应该有React组件。通过React渲染。

为了生成测试控件，我将使用JSON Schema在组件中包含元。然后可以使用某些表单生成器生成表单控件，例如plexus-form或tcomb-form。