title: Import css files and react components in a create-react-app application?
body: <p>I'm just starting with react.js and create-react-app application so excuse me if this is an obvious question.</p>
  
  <p>My 'src' folder structure is like this:</p>
  
  <pre><code>scr/
  ....components/
  ........ComponentA.jsx
  ........Componentb.jsx
  ....styles/
  ........ComponentA.css
  ....App.css
  ....App.js
  ....App.test.js
  ....index.css
  ....index.js
  ...OTHER DEFAULT FILES
  </code></pre>
  
  <p>In App.js I have this:</p>
  
  <pre><code>import React, { Component } from 'react';
  import ComponentA from './components/ComponentA';
  
  class App extends Component {
    render() {
      return (
        &lt;div className="App"&gt;
          &lt;ComponentA /&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default App;
  </code></pre>
  
  <p>In <code>ComponentA</code> I have this:</p>
  
  <pre><code>import React, { Component } from 'react';
  import './styles/ComponentA.css';
  import ComponentB from './components/ComponentB';
  
  class ComponentA extends Component {
    render() {
      return (
        &lt;div className="componentAStyle"&gt;
          &lt;ComponentB /&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default ComponentA;
  </code></pre>
  
  <p>In <code>ComponentB</code> I have this:</p>
  
  <pre><code>import React, { Component } from 'react';
  
  class ComponentB extends Component {
    render() {
      return (
        &lt;div&gt;
          &lt;h1&gt;Hello from ComponentB&lt;/h1&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default ComponentB;
  </code></pre>
  
  <p>What I'm trying to do is just import <code>ComponentB</code> from <code>ComponentA</code> and also import the style for <code>ComponentA</code> but all this fall showing the following message:</p>
  
  <pre><code>Failed to compile
  ./src/components/ComponentA.jsx
  Module not found: Can't resolve './styles/ComponentA.css' in 'C:\xampp\htdocs\custom-k39\src\components'
  This error occurred during the build time and cannot be dismissed.
  </code></pre>
  
  <p>And if I remove the css import there is another error message:</p>
  
  <pre><code>Failed to compile
  ./src/components/ComponentA.jsx
  Module not found: Can't resolve './components/ComponentB' in 'C:\xampp\htdocs\custom-k39\src\components'
  This error occurred during the build time and cannot be dismissed.
  </code></pre>
  
  <p>How can I import another component from another component and its respective css?</p>
  
  <p>Thanks.</p>