我可以在PostCSS中使用带变量参数的类吗？

Question

我可以在PostCss中使用带变量参数的类吗？

这样的事情：

.my-class(varWidth) { width: varWidth }

而不是在React组件中使用这个类：

import {myClass} import './MyComponent.scss'

...

<div className={myClass(100px)}></div>

Answer 1

您可能需要使用PostCSS Loader（Webpack的加载器使用PostCSS处理CSS）。 通过以下方式安装PostCSS Loader：

npm i -D postcss-loader

配置 postcss.config.js

module.exports = {
parser: 'sugarss',
plugins: {
'postcss-import': {},
'postcss-cssnext': {},
'cssnano': {}
 }
}

您可以在此处阅读有关常见PostCSS配置的更多信息。https://github.com/michael-ciniawsky/postcss-load-config