我可能会遗漏一些显而易见的东西,但出于某种原因,当我尝试嵌套sass规则时,没有任何渲染。然而,其他方面似乎都很好。
在这种情况下,悬停不起作用。
JSX:
const SidebarSection = (props) =>
<div className={styles.sidebarPane}>
<ul className={styles.navList}>
<li className={styles.navElement}>{props.element}</li>
</ul>
</div>;
scss示例规则:
.navElement {
cursor: pointer;
margin: .5rem 0 0 0;
&:hover {
color:yellow;
}
}
Webpack css / sccs加载器:
test: /\.(css|scss)$/,
use: [{
loader: 'style-loader',
}, {
loader: 'css-loader',
options: {
modules: true,
},
}, {
loader: 'postcss-loader',
}