How Can I Confiqure the Vue-Loader

[wmacklin]

I am having trouble configuring the vue loader in the quasar.conf.js file. I am getting an error of:

UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was
not handled with .catch()

This is my code:

const VueLoaderPlugin = require('vue-loader/lib/plugin')

build: {
      scopeHoisting: true,
      extendWebpack (cfg) {
        cfg.module.rules.push({
          enforce: 'pre',
          test: /\.(js|vue)$/,
          loader: 'eslint-loader',
          exclude: /node_modules/,
          options: {
            formatter: require('eslint').CLIEngine.getFormatter('stylish')
          }
        })
        cfg.module.rules.push({
          test: /\.vue$/,
          use: [
            {
              loader: 'vue-loader',
              options: {
                transpileOptions: {
                  transforms: {
                    dangerousTaggedTemplateString: true
                  }
                }
              }
            }
          ]
        })
        cfg.plugins.push(new VueLoaderPlugin())
      }
    },

[s.molinari]

AFAIK, Quasar already has vue-loader in use. No need to add it again to webpack. That being said, I’m not sure how to get to the config of vue-loader to change it. Someone with more webpack/ Quasar experience would need to pitch in here.

Scott

[wmacklin]

@s-molinari Thanks. That was the key. I was able to fix my issue.

[morlz]

extendWebpack (cfg) {
  const vueLoaderRule = cfg.module.rules
    .find(el => el.test.toString() == /\.vue$/.toString())

  const ruleFirstLoader = vueLoaderRule.use[0]
  const options = ruleFirstLoader.options

  // change options
  options.transpileOptions = {
    transforms: {
      dangerousTaggedTemplateString: true
    }
  }
}