用CSS模块扩展框架的css类

Question

我目前正在开发一个反应性项目，在某些情况下，我必须用属性扩展CSS类框架，比如引导。例如，我想更改这个类的背景色(https://github.com/ColorlibHQ/AdminLTE/blob/v2.4.18/dist/css/AdminLTE.css#L99)。

我怎样才能用babel-plugin-react-css-modules？做到这一点？我只能使用我自己的CSS类或AdminLTE的一个：

import React from 'react';
import bootstrap from 'boostrap';
import foo from './Foo.css';

export default class Foo extends React.Component {
  render () {
    return <div styleName='foo.main-footer'>Hello World</div>;
    or
    return <div styleName='bootstrap.main-footer'>Hello World</div>;
  }
}

在项目中，我们使用webpack (v4.41.0)，babel (v7.6.2)和react (16.10.1)。为了使用CSS类，我们使用babel插件-插件-react css -模块，它使用css模块。

什么是现代和现代的方式来做到这一点？

Answer 1

我找到了一个解决方案，您只需一个接一个地命名两个类：

import React from 'react';
import bootstrap from 'boostrap';
import foo from './Foo.css';

export default class Foo extends React.Component {
  render () {
    return <div styleName='bootstrap.main-footer foo.main-footer'>Hello World</div>;
  }
}