抛弃 React-app-rewired，认识你的新宠——Craco

作为一名经验丰富的 React 开发人员，您可能听说过 React-app-rewired 和 Craco 这两个工具。它们都是用来重写 CRA 配置的，但它们之间存在着一些关键差异。

React-app-rewired 是一个流行的工具，它允许您在不 eject CRA 的情况下重写 CRA 配置。然而，React-app-rewired 已经有一段时间没有更新了，而且它可能会在未来的某个时候停止工作。

Craco 是一个相对较新的工具，它也允许您在不 eject CRA 的情况下重写 CRA 配置。但是，Craco 比 React-app-rewired 更灵活，它允许您使用更多的方式来重写 CRA 配置。

在本文中，我们将向您展示如何使用 Craco 来重写 CRA 配置，而无需 eject。我们将从一个简单的示例开始，然后逐渐深入到更复杂的示例中。

安装 Craco

首先，您需要安装 Craco。您可以使用以下命令来安装 Craco：

npm install --save-dev craco

安装 Craco 后，您需要在您的项目中创建一个 craco.config.js 文件。这个文件将用于存储您的 Craco 配置。

使用 Craco 重写 CRA 配置

在您的 craco.config.js 文件中，您可以使用 Craco 的 API 来重写 CRA 配置。例如，您可以使用以下代码来修改 webpack 配置：

module.exports = {
  webpack: {
    configure: (webpackConfig, { env, paths }) => {
      // ...
      return webpackConfig;
    },
  },
};

您还可以使用 Craco 的 API 来修改 Babel 配置、Jest 配置等。有关 Craco API 的更多信息，请参阅 Craco 文档。

抛弃 React-app-rewired，拥抱 Craco

现在您已经了解了 Craco 的强大功能，是时候抛弃 React-app-rewired 并拥抱 Craco 了。Craco 是一个更灵活、更强大的工具，它将帮助您轻松重写 CRA 配置，而无需 eject。

Craco 还具有以下优势：

• 它比 React-app-rewired 更灵活，它允许您使用更多的方式来重写 CRA 配置。
• 它比 React-app-rewired 更易于使用，它具有更友好的 API 和更好的文档。
• 它是一个更活跃的项目，它会定期更新，并修复 bug。

如果您正在寻找一个工具来重写 CRA 配置，那么 Craco 是一个很好的选择。它比 React-app-rewired 更灵活、更强大，并且更容易使用。