Skip to content

Instantly share code, notes, and snippets.

@riskers
Last active August 24, 2017 09:52
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save riskers/cbe987e6f756eeae877ff98744f7c859 to your computer and use it in GitHub Desktop.
Save riskers/cbe987e6f756eeae877ff98744f7c859 to your computer and use it in GitHub Desktop.
css modules + react + babel-react-css-modules
  • 在入口文件(app.js)引入全局 css (:global(.xxx){...}), .xxx 不会被解析成 hash,可以在组件中 className="xxx" 使用
  • 本地css在组件(demo.js)中引入局部 css (.yyy{...}) ,在组件中 styleName="yyy" 使用

common.css: global-style

:global(.xxx) {
  ...
}

style.css: local-style

.yyy {
  ...
}

app.js:

import "./common.css";

ReactDOM.render(
  <Demo />,
  document.getElementById('app')
)

demo.js

import './style.css'

<div className="xxx" styleName="yyy">
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment