"ALWAYS use when writing code importing \"quasar\". Consult for debugging, best practices, or modifying quasar."
Install
npx skillscat add harlan-zw/vue-ecosystem-skills/quasar-skilld Install via the SkillsCat registry.
quasarframework/quasar quasar
Version: 2.18.6 (Nov 2025)
Tags: legacy: 1.22.10 (May 2023), latest: 2.18.6 (Nov 2025)
References: Docs — API reference, guides • GitHub Issues — bugs, workarounds, edge cases • GitHub Discussions — Q&A, patterns, recipes • Releases — changelog, breaking changes, new APIs
API Changes
This section documents version-specific API changes — prioritize recent major/minor releases.
BREAKING:
v-model-> usesmodel-value+@update:model-valueinstead ofvalue+@inputin Vue 3 sourceBREAKING:
QDrawer/QDialog/QMenu/QTooltip-> useclassandstyleattributes instead ofcontent-class/content-styleprops sourceBREAKING:
QImg-> completely redesigned, removedtransitionandbasicprops; renamedno-default-spinnertono-spinnersourceBREAKING:
QScrollArea-> methodsgetScrollPositionreturns{ top, left };setScrollPositionandsetScrollPercentagerequireaxisparameter sourceBREAKING:
QTable-> renameddataprop torowsto avoid TS naming conflicts sourceBREAKING:
Platform.is-> all boolean properties now explicitlyfalseinstead ofundefinedsince v2.17.0 sourceBREAKING:
colorsutils ->getBrandandsetBrandreplaced bygetCssVarandsetCssVarrespectively sourceBREAKING: Scroll utils -> renamed
getScrollPositiontogetVerticalScrollPosition,animScrollTotoanimVerticalScrollTo, andsetScrollPositiontosetVerticalScrollPositionsourceBREAKING:
dateutils ->addToDateandsubtractFromDateproperty names normalized (e.g.,year->years,month->months) sourceBREAKING:
QPopupEdit-> must now use the default slot withv-slot="scope"for performance sourceBREAKING:
GoBackdirective -> removed; use router reference ($router.back()or$router.go(-1)) instead sourceNEW:
useQuasarcomposable -> primary method for accessing the$qobject within Composition API componentsNEW:
useMetacomposable -> new way to define meta tags, replacing the now deprecatedmetacomponent property sourceNEW:
QTableprops -> addedtable-row-style-fn,table-row-class-fn,grid-style-fn, andgrid-class-fnin v2.18.0 source
Also changed: useFormChild() new composable · QOptionsGroup props option-value, option-label, option-disable new v2.17.0 · QUploader prop thumbnail-fit new v2.17.0 · QSelect prop disable-tab-select new v2.17.0 · QMenu/QBtnDropdown no-esc-dismiss new v2.18.0 · evt.qAvoidFocus new flag v2.18.0 · QDate model-value no longer contains changed prop · QPagination prop gutter new · QImg props loading, crossorigin, fit new · Dialog plugin custom component props moved to componentProps · Loading plugin uses html: true for HTML content instead of sanitize · App.vue wrapper <div id="q-app"> removed · .sync modifier replaced by v-model:propName
Best Practices
Use
#q-app/wrappersinstead ofquasar/wrappersfor defining configurations and boot files — provides superior type inference and alignment with modern Quasar CLI sourceUse Regle as the recommended validation library for
QInputandQField— provides a robust, externalized validation logic compared to inline rules sourcePrefer responsive CSS classes (e.g.,
gt-sm,lt-md) over theScreenplugin in JavaScript — minimizes re-renders and layout shifts by leveraging CSS media queries directly sourceBootstrap custom dialog components with the
useDialogPluginComponentcomposable — handles the complex internal communication and lifecycle requirements of the Dialog plugin automatically sourceEnable the
no-transitionprop onQTreewhen rendering large datasets — significantly improves runtime performance by skipping expensive expansion/collapse animations sourceUse Quasar's
useIntervalanduseTimeoutcomposables over native browser timers — ensures automatic cancellation and memory cleanup when the component is unmounted sourcePlace
QPullToRefreshas a direct child ofQPagewhen usingQLayout— ensures correct scroll event interception and native-like pull behavior within the layout container sourceAvoid setting
Darkmode toautoin SSR applications — prevents the "flicker" effect where the server renders light mode before the client synchronizes with system preferences sourceDo not use
v-modelwithQRouteTabcomponents — the active state is derived directly from the current route, and manual model updates will not trigger navigation sourcePrefer the Loading Bar Plugin over manual
QAjaxBarcomponent instances — provides a simpler, globally managed progress indicator for all Ajax calls without per-page wiring source