quasarframework/quasar · error · Error

[Quasar] In your Vite config file, please add the Quasar plu

Error message

[Quasar] In your Vite config file, please add the Quasar plugin ** after ** the Vue one

What it means

Quasar's Vite plugin patches Vue's template compiler (config injected by the vue plugin) and therefore must run AFTER the Vue plugin in the plugins array. In configResolved it searches for a plugin named 'vite:vue' and throws this error if it isn't found, which almost always means the Quasar plugin was listed before Vue (so Vue's resolved config hadn't registered yet) or Vue's plugin is missing entirely.

Source

Thrown at vite-plugin/src/plugin.js:51

  for (const key of defaultOptionsKeys) {
    if (opts[key] === void 0) {
      opts[key] = defaultOptions[key]
    }
  }

  return opts
}

function getConfigPlugin(opts) {
  return {
    name: 'vite:quasar:vite-conf',

    configResolved(viteConf) {
      const vueCfg = viteConf.plugins.find(entry => entry.name === 'vite:vue')

      if (vueCfg === void 0) {
        throw new Error(
          '[Quasar] In your Vite config file, please add the Quasar plugin ** after ** the Vue one'
        )
      }
    },

    config(viteConf, { command }) {
      return getViteConfig(
        opts.runMode,
        command === 'serve',
        viteConf,
        opts.sassVariables
      )
    }
  }
}

const scssMatcher = createExtMatcher(['scss', 'module.scss'])
const sassMatcher = createExtMatcher(['sass', 'module.sass'])

View on GitHub (pinned to 4841521b5f)

Solutions

  1. Reorder plugins so Quasar comes after Vue: `plugins: [vue(), quasar()]`.
  2. Confirm @vitejs/plugin-vue is installed and actually invoked in the plugins array (not just imported).
  3. If using a framework preset that injects plugins dynamically, ensure quasar() isn't prepended before the preset's vue() call.

Example fix

// before (vite.config.js)
plugins: [quasar(), vue()]

// after
plugins: [vue(), quasar()]
Defensive patterns

Strategy: validation

Validate before calling

// static sanity check for your vite config
const plugins = [vue(), quasar()]
const qIdx = plugins.findIndex(p => p && p.name === 'vite:quasar:vite-conf')
const vIdx = plugins.findIndex(p => p && p.name === 'vite:vue')
if (vIdx === -1 || (qIdx !== -1 && qIdx < vIdx)) {
  throw new Error('Quasar plugin must come AFTER the Vue plugin')
}

Prevention

When it happens

Trigger: vite.config.js exporting plugins: [quasar(), vue()] (wrong order); the Vue plugin installed under a name the check can't find (very old @vitejs/plugin-vue); forgetting to add vue() altogether while using Quasar's plugin.

Common situations: Manually wiring Quasar into a Vite config (or migrating a non-Quasar project) and placing quasar() first; copying a config snippet where plugin order got rearranged; upgrading @vitejs/plugin-vue to a version with a different internal name.

Related errors


AI-assisted analysis of quasarframework/quasar@4841521b5f (2026-08-30). Data as JSON: /api/errors/2b9bf4fa537454db. Report an issue: GitHub.