title: webpack v5 devtool should match pattern
body: <p>Setting up a simple Middleman app utilizing webpack 5, but getting this invalid configuration object error:</p>
  <pre><code>[webpack-cli]
  Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
   - configuration.devtool should match pattern &quot;^(inline-|hidden-|eval-)?(nosources-)?(cheap-(module-)?)?source-map$&quot;.
     BREAKING CHANGE since webpack 5: The devtool option is more strict.
     Please strictly follow the order of the keywords in the pattern.
  </code></pre>
  <p>None of the <a href="https://webpack.js.org/configuration/devtool/" rel="nofollow noreferrer">devtool options listed here</a> seem to give any other error than the one above, nor does leaving out devtool or explicitly making it false.</p>
  <p>This is the setup I had working with webpack 4, but would appreciate any insight into what could unblock the invalid configuration error.</p>
  <p>My package.json</p>
  <pre><code>{
    &quot;name&quot;: &quot;webpack5_practice&quot;,
    &quot;version&quot;: &quot;1.0.0&quot;,
    &quot;description&quot;: &quot;&quot;,
    &quot;main&quot;: &quot;index.js&quot;,
    &quot;scripts&quot;: {
      &quot;test&quot;: &quot;echo \&quot;Error: no test specified\&quot; &amp;&amp; exit 1&quot;
    },
    &quot;keywords&quot;: [],
    &quot;author&quot;: &quot;&quot;,
    &quot;license&quot;: &quot;ISC&quot;,
    &quot;devDependencies&quot;: {
      &quot;css-loader&quot;: &quot;^4.3.0&quot;,
      &quot;mini-css-extract-plugin&quot;: &quot;^1.0.0&quot;,
      &quot;node-sass&quot;: &quot;^4.14.1&quot;,
      &quot;sass-loader&quot;: &quot;^10.0.3&quot;,
      &quot;webpack&quot;: &quot;^5.0.0&quot;,
      &quot;webpack-cli&quot;: &quot;^4.0.0&quot;
    }
  }
  </code></pre>
  <p>My webpack.config.js</p>
  <pre><code>const path = require('path');
  const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  
  module.exports = {
    devtool: 'inline-source-map',
    mode: 'development',
    entry: {
      site: ['./source/javascripts/site.js'],
      style: ['./source/stylesheets/site.css.scss'],
    },
    output: {
      path: path.resolve(__dirname, '.tmp/dist'),
      filename: '[name].min.js',
    },
    module: {
      rules: [
        {
          test: /\.(sa|sc|c)ss$/,
          use: [
            MiniCssExtractPlugin.loader,
            'css-loader',
            'sass-loader',
          ],
        }
      ]
    },
    plugins: [new MiniCssExtractPlugin()],
  };
  </code></pre>
  <p>My config.rb w/ regards to webpack</p>
  <pre><code># Webpack
  activate :external_pipeline,
    name: :webpack,
    command: build? ? './node_modules/webpack/bin/webpack.js --bail' : './node_modules/webpack/bin/webpack.js --watch -d',
    source: &quot;./dist&quot;,
    latency: 1
  </code></pre>