title: Preact CLI CSS Modules
body: <p>The <a href="https://github.com/developit/preact-cli" rel="noreferrer">Preact CLI</a> claims it supports <code>CSS Modules</code> out of the box. So this is what I tried; Given 2 files <code>index.js</code> and <code>index.module.scss</code> in the same folder I tried this:</p>
  
  <p><strong>index.js</strong></p>
  
  <pre><code>import { h, Component } from 'preact';
  import styles from './index.module.scss';
  
  export default class Layout extends Component {
  
    render() {
      console.log(styles);
      return (
        &lt;div className={styles.container}&gt;
          {this.props.children}
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p><strong>index.module.scss</strong></p>
  
  <pre><code>.container {
    margin: 50px auto;
    max-width: 960px;
    width: 100%;
  }
  </code></pre>
  
  <p>The <code>console.log</code> statement prints <code>{}</code>, the <code>class</code> attribute in the HTML is empty.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>Oh, to install this stuff I just did</p>
  
  <pre><code>preact create default my-project
  yarn add -D node-sass sass-loader
  </code></pre>