时间戳

首页 > 解决方案 > 在 craco 中读取配置文件创建反应应用程序设置

webpack - 在 craco 中读取配置文件创建反应应用程序设置

问题描述

我正在阅读我的配置文件，这取决于我的环境，而不是弹出我的 create-react-app 的 webpack。

我发现一些StackOverflow 引用来更改 Webpack 配置以读取配置文件取决于环境。

externals: {
  'Config': JSON.stringify(process.env.NODE_ENV === 'production' ? require('./config.prod.json') : require('./config.dev.json'))
}

我在src/config/globals/目录下有以下文件。

prod.js
dev.js
test.js

我只是尝试根据环境选择正确的配置文件。我的 craco 配置文件内容，

module.exports = {
    externals: {
      config: process.env.NODE_ENV === 'production' ? require('./src/config/globals/prod.js') : require('./src/config/globals/dev.js'),
    },
  }

但是当我尝试在我的组件中导入配置文件时，我得到了Module not found错误。

Module not found: Can't resolve 'config'

我的进口声明，

import GlobalConfig from 'config'

导出配置文件对象的方式是，

module.exports = GlobalConfig;

如何读取配置文件取决于 craco config 设置的环境？

标签： webpackenvironment-variablesconfigcreate-react-appcraco

解决方案

以下 craco.config.js 为我工作：

module.exports = {
    webpack: {
        configure: (webpackConfig) => {
            webpackConfig.externals = {
                'Config': JSON.stringify(process.env.NODE_ENV === 'production' ? require('./config.prod.json') : require('./conf/config.dev.json'))
            };
            return webpackConfig;
        },
    }
};

推荐阅读