title: Change option of sass-loader in vue.config
body: <p>I am confused how to change <code>sass-loader</code> settings using <code>vue.config</code> <a href="https://vue-loader.vuejs.org/guide/pre-processors.html#sass" rel="nofollow noreferrer">in this documentation</a> there is a <code>webpack.config</code> but my project doesn't have one and I don't think I should have one because according to <a href="https://cli.vuejs.org/guide/webpack.html#chaining-advanced" rel="nofollow noreferrer">this documentation</a> I should use <code>vue.config</code>.</p>
  
  <p>The command <code>vue inspect</code> contains the string <code>loader: 'sass-loader',</code> 8 times so I'm not sure what to change.</p>
  
  <p>My source code is the following:</p>
  
  <pre class="lang-css prettyprint-override"><code>    &lt;style lang="scss"&gt;
        .some-class {
          border-bottom: 100px solid $alert;
        }
      &lt;/style&gt;
  </code></pre>
  
  <p>Then I would like to adjust the values for <code>webpack</code> using <code>vue.config</code> to:</p>
  
  <pre class="lang-js prettyprint-override"><code>    {
        loader: 'sass-loader',
        options: {
          prependData: '$alert: ' + process.env.ALERT_COLOR + ';',
        }
      }
  </code></pre>
  
  <p>I suspect I have to change the following entry (coming from <code>vue inspect</code>):</p>
  
  <pre class="lang-js prettyprint-override"><code>    /* config.module.rule('scss').oneOf('vue-modules') */
      {
        resourceQuery: /module/,
        use: [
          {
            loader: 'vue-style-loader',
            options: {
              sourceMap: false,
              shadowMode: false
            }
          },
          {
            loader: 'css-loader',
            options: {
              sourceMap: false,
              importLoaders: 2,
              modules: true,
              localIdentName: '[name]_[local]_[hash:base64:5]'
            }
          },
          {
            loader: 'postcss-loader',
            options: {
              sourceMap: false
            }
          },
          {
            loader: 'sass-loader',
            options: {
              sourceMap: false,
              implementation: {
                run_: function() {
                          return _call(f, Array.prototype.slice.apply(arguments));
                        },
                render: function() {
                          return _call(f, Array.prototype.slice.apply(arguments));
                        },
                renderSync: function() {
                          return _call(f, Array.prototype.slice.apply(arguments));
                        },
                info: 'dart-sass\t1.23.0\t(Sass Compiler)\t[Dart]\ndart2js\t2.5.1\t(Dart Compiler)\t[Dart]',
                types: {
                  Boolean: function() {
                            return _call(f, Array.prototype.slice.apply(arguments));
                          },
                  Color: function() {
                            return _call(f, this, Array.prototype.slice.apply(arguments));
                          },
                  List: function() {
                            return _call(f, this, Array.prototype.slice.apply(arguments));
                          },
                  Map: function() {
                            return _call(f, this, Array.prototype.slice.apply(arguments));
                          },
                  Null: function() {
                            return _call(f, Array.prototype.slice.apply(arguments));
                          },
                  Number: function() {
                            return _call(f, this, Array.prototype.slice.apply(arguments));
                          },
                  String: function() {
                            return _call(f, this, Array.prototype.slice.apply(arguments));
                          },
                  Error: function Error() { [native code] }
                }
              }
            }
          }
        ]
      }
  </code></pre>