Reactjs 基于环境变量的条件导入

我有一个react组件，它有X个选项，用于导入使用CSS模块的样式表

理想情况下，我希望通过使用获取全局环境变量，例如

process.env.THEME

我不能使用：

import MyStyleSheet from `${process.env.THEME}/my.module.css`

我可以使用：

const MyStyleSheet = require(process.env.THEME/my.module.css);

然而

import/no dynamic require

eslint规则开始说它不好。

我读到的所有文章和帖子都说这是不可能的。 当然，这是一个普遍的需求，但我不能为我的生活想出如何做到这一点。有什么想法吗

---

更新：

import React from 'react';

const Classes = import('./${process.env.theme}/Button.module.css');

const Button = () => (
  <button className={Classes.button}>My Themed Button</button>
);

export default Button;

从“React”导入React；
const Classes=import（'./${process.env.theme}/Button.module.css'）；
常量按钮=（）=>(
我的主题按钮
);
导出默认按钮；

例如，作为安装组件时的一种解决方法，您可以尝试检查环境变量，然后需要特定的css文件，如下所示：

class App extends Component {
    componentWillMount() {
         if(process.env.CUSTOM_ENV_VAR === 'test') {
            require('styles1.css');
         } else {
            require('styles2.css');
         }
    }
}

---

将其解析为承诺应该可以实现css模块的技巧：

if (process.env.CUSTOM_ENV_VAR === 'theme1') {
    import('./theme1.css').then(() => {
        // ...
    });
else (process.env.CUSTOM_ENV_VAR === 'theme2') {
    import('./theme2.css').then(() => {
        //...
    });
}

import(`./${process.env.CUSTOM_ENV_VAR}.css`).then(() => {
    //...
});

---

参考部分：

唯一的问题是它不允许我使用CSS模块。作为承诺解决它应该可以解决CSS模块的问题。我将更新答案。很抱歉，到目前为止，我无法检查此问题，这始终会返回一个承诺，而不是加载前的值，因此css模块从不在模板上启动该值。用更多的代码更新了我的代码。这真的不起作用了（更多？）。使用“require”的构建始终包括构建中的所有静态文件，即使它们位于绑定到环境变量的条件中！