SCSS/CSS Module support

[bjackson]

This PR adds SCSS/CSS module support. Usage is as follows:

// Filename: HomePage.module.scss
.hero {
  color: red;
}

// Filename: HomePage.js
import styles from './HomePage.module.scss'

const HomePage = () => (
  <div className={styles.hero}>Hello</div>
)

export default HomePage

The div that contains hello will have the hero class applied to it.

This also adds sourcemap support for SCSS/CSS with or without modules. So in your web inspector, you can view the source for the styles, instead of it saying <style> for the source.

Classnames are generated with hashes in production builds, like in the image above. In dev, the names are more descriptive like: .src-pages-HomePage-HomePage-module__heroName--rNGDY. This is based on the recommendations in css-loader's documentation.

[peterp]

Thanks for this!

[brianespinosa]

Thank you @bjackson this was the last thing I needed to jump in and start playing with Redwood and I did not have the bandwidth to try adding the support myself.

And I can see that this was added today in v0.10.0 🎉