我目前正在开发一个 react 元素,在某些情况下必须扩展框架的 CSS 类,例如带有属性的 bootstrap。例如,我想更改此类的背景颜色 ( 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 模块。
什么是现代和现代的方式来做到这一点?
最佳答案
我找到了一个解决方案,您只需依次命名两个类:
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>;
}
}
关于css - 使用 css 模块扩展框架的 CSS 类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58208929/