使用 Jest、React 和 Webpack 处理全局导入答案

【问题标题】：Handling global imports with Jest, React, and Webpack使用 Jest、React 和 Webpack 处理全局导入
【发布时间】：2017-12-02 11:35:53
【问题描述】：

我最近开始从事一个已经成熟的项目，我正在集成 Jest 测试框架。该项目将 React 与 Webpack 结合使用。在 webpack 配置中，团队使用 webpack.ProvidePlugin 来提供 React、lodash 和类名（不是我会做的，但无论如何）。

我遇到的问题是文件顶部的大多数 React 类都包含类似 React.Component 的内容，由于 webpack 基本配置，它可以正常工作。但是，当我运行相应的测试文件时，我只会得到React is not defined，除非我明确需要 React。

有一个需要基本 webpack 配置的 webpack.test.config 文件，但我似乎无法获得它，因此我可以运行测试而无需在每个文件的顶部显式包含 import React from 'react'。我不想在每个文件中手动导入 React，有人有什么建议吗？

【问题讨论】：

【解决方案1】：

我认为在这种情况下使用全局变量是一种反模式。我会删除全局变量并在每个文件中包含react

【讨论】：

【解决方案2】：

您可以尝试使用 jest 的 resolver，当您到达 react 导入时，返回做出反应的路径。或者你可以在那里使用 jest 的 setupFile 和 import React from 'react';

【讨论】：