脚手架搭建react如何显示配置文件

显示 React 脚手架配置文件的常用方法

使用 eject 暴露配置（适用于 Create React App） 运行以下命令将隐藏的配置文件完全暴露出来，生成 config 和 scripts 目录。注意此操作不可逆：

npm run eject

查看部分配置（不 eject） 通过以下命令可以查看 webpack 配置的合并结果，但不会生成物理文件：

npm run start -- --show-config

使用第三方工具分析 安装 react-app-rewired 和 craco 等工具可以覆盖或扩展配置，同时保持原始配置的可读性：

npm install react-app-rewired --save-dev

创建自定义配置文件 在项目根目录新建 craco.config.js 文件，通过该文件可以修改默认配置：

module.exports = {
  webpack: {
    configure: (webpackConfig) => {
      // 修改配置
      return webpackConfig;
    }
  }
};

查看特定 loader 配置 通过调试模式启动项目，可以在浏览器开发者工具的 Sources 面板中查看运行时加载的 webpack 配置：

npm run start -- --inspect

使用 Vite 脚手架 如果使用 Vite 创建的 React 项目，配置文件 vite.config.js 默认就是可见的，位于项目根目录。