title: Module not found: Error: Can't resolve 'sass-loader'
body: <p>New to webpack.  Trying to get sass-loader to play nice with my react project, have followed tutorials.  Config seems correct, but result is always "Can't resolve 'sass-loader'".  </p>
  
  <p>I suspect this is some glaringly obvious error, but no amount of searching for it or googling has led me to it yet.  Any help appreciated.</p>
  
  <p><strong>Error</strong></p>
  
  <pre><code>ERROR in ./ui/index.js
  Module not found: Error: Can't resolve 'sass-loader' in '/root/src'
   @ ./ui/index.js 19:0-33
   @ multi webpack-hot-middleware/client?reload=true babel-polyfill ./ui/index.js
  </code></pre>
  
  <p><strong>What I have done so far (on said pre-existing react project):</strong> </p>
  
  <p><code>npm i --save-dev node-sass sass-loader</code></p>
  
  <p>package.json, under devDependencies</p>
  
  <pre><code>"node-sass": "^4.7.2",
  "sass-loader": "^6.0.6",
  "webpack": "~2.2.1",
  "webpack-dev-middleware": "~1.12.0",
  "webpack-hot-middleware": "~2.20.0",
  "webpack-node-externals": "~1.6.0"
  </code></pre>
  
  <p>index.js</p>
  
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom';
  import { HashRouter } from 'react-router-dom';
  import App from './src/App';
  
  require('./src/styles/main.scss');
  
  ReactDOM.render(&lt;HashRouter&gt;&lt;App /&gt;&lt;/HashRouter&gt;, 
  document.getElementById('root'));
  </code></pre>
  
  <p>webpack.config.react.js:</p>
  
  <pre><code>const path = require('path');
  const webpack = require('webpack');
  
  const ExtractTextPlugin = require('extract-text-webpack-plugin');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  
  const sourcePath = path.join(__dirname, './ui');
  const extractStyle = new ExtractTextPlugin('styles.css');
  
  //======break to module rules=======
  
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        include: sourcePath,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['react'],
        },
      },
      {
        test: /\.scss$/,
        include: sourcePath,
        exclude: /node_modules/,
        use: extractStyle.extract('sass-loader?sourceMap'),
      },
      {
        test: /\.css$/,
        exclude: sourcePath,
        loader: extractStyle.extract('css-loader'),
      },
    ],
  },
  
  //======= break again for plugins =====
  
  plugins: [
    extractStyle,
    new HtmlWebpackPlugin({
      template: 'ui/index.html',
      title: 'name',
    }),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NamedModulesPlugin(),
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('development'),
    }),
  ]
  </code></pre>
  
  <p>Possible confounder: This is all running in a development docker container.  It's been rebuilt and npm install has run again, though.</p>