IntelliJ 的 emmet + react-css-modules

Question

我正在转到React-CSS-Modules，需要类布局为：

<div styleName="local-class-here">

而不是传统：

<div className="global-class-here">

如何自定义Intellij中的Emmet，以便我扩展

.my-class

它将返回此？：

<div styleName="my-class">

Answer 1

无法做到这一点；如果您错过此功能，请关注Web-28691进行更新

Answer 2

使用内置的CSS模块，也可以与sass一起使用https://github.com/css-modules/css-modules

// this is the only page that should import styles this way, please use getStyles() so styles are not repeated in the header
import dig from "src/style.module.scss"

// the thought has occurred to me to put this in the DropVariables file, but getStyles of a different nature exists there, oops.
// feel free to un-clobber and move this.
export function getStyles<iCSS extends {}>(overrides: iCSS = {} as iCSS): typeof dig & iCSS {
    return {
        ...dig,
        ...overrides
    }
}

Answer 3

尝试使用补丁样式。在这种情况下，您仍将使用传统的className，并在那里得到同样的东西。您的代码看起来像这样：

<PatchStyles classNames={styles}>
  ...
  <div styleName="my-class">
    ...
  <div>
</PatchStyles>

它将自动更新您的className S，而不是您。