title: React : CSS class name import not working
body: <p>i have a <code>&lt;main&gt;</code> div in my react component and im importing some class name from a class css file, but the class name is not getting integrated to the main div when i try to inspect it in the browser. when i simply use other class names its working like <code>&lt;main className="test"&gt;</code> but importing classes is not working.</p>
  
  <p>This is my component :</p>
  
  <pre><code>import React from 'react';
  import Aux from '../../hoc/Aux';
  import classes from './Layout.css';
  
  const layout = (props) =&gt; (
  &lt;Aux&gt;
      &lt;div&gt;
          Test paragraph
      &lt;/div&gt;
      &lt;main className={classes.Content}&gt;
          {props.children}
  
      &lt;/main&gt;
  &lt;/Aux&gt;
  );
  
  export default layout;
  </code></pre>
  
  <p>This is my css </p>
  
  <pre><code>.Content{
     color: red;
     margin-top: 20px;
  }
  </code></pre>
  
  <p>I did <code>npm run eject</code> command after creation, if there is something to do with the webpack configuration file please help me
  ( i haven't made any changes there after eject command )</p>
  
  <p>Here is the css part of webpack dev config file </p>
  
  <pre><code>{
          test: cssRegex,
          exclude: cssModuleRegex,
          use: getStyleLoaders({
            importLoaders: 1,
          }),
        },
        // Adds support for CSS Modules (https://github.com/css-modules/css-modules)
        // using the extension .module.css
        {
          test: cssModuleRegex,
          use: getStyleLoaders({
            importLoaders: 1,
            modules: true,
            getLocalIdent: getCSSModuleLocalIdent,
          }),
   },
  </code></pre>