title: Failed to load scss with webpack
body: <p>I'm using webpack, and I want to load scss file in my JavaScript. (Or if it can be separate, it also fine).</p>
  
  <p>This is my webpack config:</p>
  
  <pre><code>"use strict";
  const CopyWebpackPlugin = require('copy-webpack-plugin');
  const path = require('path');
  
  module.exports = {
      context: __dirname + '/src',
      entry: './js/index.js',
      output: {
          path: './build',
          filename: 'js/app.bundle.js'
      },
      module: {
          loaders: [
              {
                  test: /\.js$/,
                  exclude: /node_modules/,
                  loader: 'babel-loader'
              },
              {
                  test: /\.scss$/,
                  loaders: ["style", "css", "sass"]
              }
          ]
      },
      resolve: {
          root: [
              path.resolve('./src/js'),
              path.resolve('./src/scss')
          ],
          extensions: ['', '.js']
      },
      plugins: [
          new CopyWebpackPlugin([
              { from: 'html/**', to: `${__dirname}/build/html`, flatten: true },
              { from: 'images/**', to: `${__dirname}/build/image`, flatten: true }
          ])
      ]
  };
  </code></pre>
  
  <p>this is my files list:</p>
  
  <ul>
  <li>src/html/index.html -> build/html/index.html (WORKED)</li>
  <li>src/images/**       -> build/images/** (WORKED)</li>
  <li>src/js/index.js     -> build/js/app.bundle.js (WORKED)</li>
  <li>src/scss/**         -> build/css/** <strong>(NOT WORKED)</strong></li>
  </ul>
  
  <p>This is my JavaScript code. I just started project, so not much codes:</p>
  
  <pre><code>import "babel-polyfill";
  import React from 'react';
  import ReactDOM from 'react-dom';
  import moduleA from 'moduleA';
  import "view/startup.scss";
  
  ReactDOM.render(
      &lt;div&gt;
          &lt;h1&gt;Helloworld!&lt;/h1&gt;
      &lt;/div&gt;,
      document.getElementById('entry')
  );
  </code></pre>
  
  <p>You can see this: <strong>import "view/startup.scss";</strong>
  I want to load scss file into my JavaScript, but when I run webpack command, it says:</p>
  
  <blockquote>
    <p>ERROR in Loader /Users/.../Desktop/work/my-project/app/node_modules/css/index.js didn't return a function
     @ ./scss/view/startup.scss 4:14-123</p>
  </blockquote>
  
  <p>in "resolve" property of webpack config, you can see that I added another root directory for scss, also I loaded sass-loader too, but it doesn't work and I don't know why.</p>
  
  <p>And as I know, with Webpack, including css/scss automatically injects into destination file, so it doesn't matter it needs to be extract as separate file, I just want that this works.</p>
  
  <p>Any help will be very appreciated :)</p>
  
  <p><strong>* UPDATED *</strong>
  code of ./scss/view/startup.scss</p>
  
  <pre><code>#startup {
      background-color: #7087d7;
  }
  </code></pre>