与 semantic-ui-react 、JEST 和 enzyme 反应

Question

我运行遇到了这个错误，其中 npm start 在以下导入中运行良好：

import Header from 'semantic-ui-react/dist/commonjs/elements/Header';

但是当我进行 npm 测试时，它总是显示：

ReferenceError: Header is not defined

但是当我将主文件中的导入更改为以下行时，npm 测试运行正常

import Header from '../node_modules/semantic-ui-react/dist/commonjs/elements/Header';

我有什么替代方法可以避免引用从 node_modules 文件夹导入的内容吗？

Answer 1

semantic-ui-react 将其所有组件导出为命名模块，这样您就不必一路挖掘各种路径来访问每个组件。相反，你可以这样做：

import { Button } from 'semantic-ui-react'
import { Header } from 'semantic-ui-react'
import { Container } from 'semantic-ui-react'

这样简单多了，是吗？而且，如果 semantic-ui-react 更改了它们的文件夹结构，您将不必更改代码。

这里semantic-ui-react documentation介绍了如何导入和使用其组件。只需单击任何示例的 "Try it" 图标即可。

React with semantic-ui-react ,JEST and enzyme