0

我目前正在开发一个反应项目,在某些情况下必须扩展 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 插件 babel-plugin-react-css-modules,它使用 css 模块。

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

4

1 回答 1

0

我找到了一个解决方案,您只需要一个接一个地命名两个类:

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>;
  }
}
于 2019-10-09T19:47:14.987 回答