title: Webpack won't compile SASS if a hexadecimal color is passed
body: <p>I'm trying to implement Webpack in an existing project which contain SASS.</p>
  
  <p>So here is my <code>webpack.config.js</code></p>
  
  <pre><code>module.exports = {
    entry: "./entry.js",
    output: {
        path: __dirname,
        filename: "bundle.js"
    },
    module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /(node_modules|bower_components)/,
          use: {
            loader: 'babel-loader',
            options: {
              presets: ['env']
            }
          }
        },
        {
          test: /\.css$/,
          use: [
            { loader: "style-loader" },
            { loader: "css-loader" },
            { loader: "sass-loader" }
          ]
        }
      ]
    },
    resolve: {
      extensions: ['*', '.js', '.jsx'],
    },
  };
  </code></pre>
  
  <p>But, when I run <code>webpack</code>, I have this error</p>
  
  <pre><code>ERROR in ./style.scss
  Module parse failed: Unexpected character '#' (1:8)
  You may need an appropriate loader to handle this file type.
  | $color: #bebebe;
  |
  | body {
   @ ./entry.js 3:13-36
  </code></pre>
  
  <p>And I have no idea why. Every solutions I found was because <code>css-loader</code> was missing. But, not in my case.</p>