小编Tom*_*mus的帖子

我有一个像这样的React项目：

这是一个简单的应用程序。的Dashboard带有UserListContainer，其中包含UserList，其中列出了四个用户及其ID和名称。UserList从获取用户Data.ts

该应用程序本身运行正常，并显示四个用户。但是，一旦我尝试UserList使用酶浅渲染测试，这些测试就会给我以下错误消息：

Invariant Violation: You must pass a component to the function returned by connect. Instead received undefined
      at invariant (node_modules/invariant/invariant.js:40:15)
      at wrapWithConnect (node_modules/react-redux/lib/components/connectAdvanced.js:97:33)
      at Object.<anonymous> (src/Users/UserListContainer.tsx:4:34)
      at Object.<anonymous> (src/Users/index.ts:1:1)
      at Object.<anonymous> (src/Dashboard/Dashboard.tsx:2:1)
      at Object.<anonymous> (src/Dashboard/index.ts:1:1)
      at Object.<anonymous> (src/Users/UserList.tsx:2:1)
      at Object.<anonymous> (src/Users/__tests__/UserList.test.tsx:3:1)

基本上，问题在于，即使在UserList浅层渲染时不使用仪表板，React仍会尝试构建它。我想发生这种情况是因为我们Data通过Dashboard索引进行访问，所以React也将尝试解析Dashboard其导入，即UserListContainer，因为它们是通过同一索引文件导出的。当我直接导入用户而不是通过索引导入用户时，问题消失了。

我们通过打破循环依赖关系解决了此问题，但是如果再次遇到该错误，我想知道其他解决方法。我还想了解为什么在测试失败的情况下，Web应用程序仍然可以正常运行。

另外，有没有一种方法可以防止使用酶浅提纯时React解决进出口问题？

用户/ __测试__ / UserList.test.tsx

test("reproduce the problem", () => {
  const wrapper = …