Configuration

Vue is configured at three layers: build flags (replaced at compile time by the bundler), runtime app.config (set on the app instance), and compiler options (passed to compileTemplate or via the SFC plugin). This page enumerates each.

Build feature flags

These are global identifiers replaced by the bundler. Bundler integrations (@vitejs/plugin-vue, vue-loader) set them automatically; the official guidance is at https://vuejs.org/api/compile-time-flags.html.

Flag	Default	Purpose
__VUE_OPTIONS_API__	true	Whether the runtime supports the Options API. Set to false if your app uses only the Composition API; saves a few KB.
__VUE_PROD_DEVTOOLS__	false	Whether the devtools hook is exposed in production. Set to true for staging or A/B-testing builds.
__VUE_PROD_HYDRATION_MISMATCH_DETAILS__	false	Detailed hydration-mismatch warnings in production. Helpful while debugging SSR issues; remove once mismatches are resolved.

Internal build flags — set by the build system, not user code:

Flag	Set by
__DEV__	rollup.config.js (true in dev, false in prod).
__TEST__	scripts/setup-vitest.ts (true in tests).
__BROWSER__	format-dependent. true for global, esm-browser; false for cjs.
__GLOBAL__, __ESM_BUNDLER__, __ESM_BROWSER__, __CJS__	exactly one is true per build.
__SSR__	true if the build interops with @vue/server-renderer. Gates the ssrUtils export.
__COMPAT__	true only in vue-compat.
__VERSION__	replaced with package.json#version.

Build flags also make their way into the source: every dev-only branch is wrapped in if (__DEV__) so it can tree-shake out of prod.

Runtime app.config

createApp(...).config exposes runtime configuration. Used at app boot, before mount. The fields are defined in packages/runtime-core/src/apiCreateApp.ts:

Field	Default	Purpose
errorHandler	none	Catches uncaught errors and async rejections from any component in the app. Receives (err, instance, info) where info is a string from ErrorTypeStrings.
warnHandler	none	Intercepts dev-mode warnings before the console.
performance	false	If true, emits performance.mark entries for component init/mount/update phases. See packages/runtime-core/src/profiling.ts.
compilerOptions	{}	Forwarded to the runtime template compiler. Only respected in full builds (with the compiler bundled).
globalProperties	{}	Properties merged into every component's this. The Vue 3 replacement for Vue.prototype.$foo.
optionMergeStrategies	{}	Custom merging for component options.
idPrefix	''	Prefix for useId-generated IDs (useful when multiple Vue apps share a page).
throwUnhandledErrorInProduction	false	If true, unhandled errors throw in production instead of being swallowed by errorHandler.

Plugin authors can extend app.config via module augmentation; Pinia, vue-router, and i18n libraries do this routinely.

Compiler options

Passed to compileTemplate (in @vue/compiler-sfc) or compile (in @vue/compiler-dom). The full type is CompilerOptions defined in packages/compiler-core/src/options.ts and extended by compiler-dom/compiler-ssr. The most relevant fields:

Option	Default	Purpose
mode	'function' (full build) / 'module' (SFC)	'function' produces function render(_ctx, _cache) {…}, 'module' produces a full ES module with imports.
prefixIdentifiers	true for ESM-bundler, false for runtime-compile	Whether to qualify free identifiers as _ctx.foo. Mandatory in module mode (no with).
hoistStatic	true (client) / false (SSR)	Enable static hoisting via cacheStatic.
cacheHandlers	true (client) / false (SSR)	Cache event handlers across renders to avoid re-creating function references.
inline	false	Inline component bindings into the render function (used by <script setup>).
bindingMetadata	none	Map of name → BindingType from <script setup> analysis; lets the template compiler optimize identifier resolution.
whitespace	'preserve'	'preserve' keeps inter-tag whitespace, 'condense' merges consecutive whitespace. The dev warning when neither is set defaults to 'preserve'.
delimiters	['{{', '}}']	Custom interpolation delimiters.
comments	true in dev / false in prod	Whether to keep HTML comments in output.
isCustomElement	() => false	Predicate for tag names that should be treated as custom elements (not Vue components).
isNativeTag	platform-dependent	Predicate for native HTML/SVG/MathML tags.
compatConfig	none	Vue 2 compat configuration (only relevant in compat builds).
nodeTransforms / directiveTransforms	depends on package	Plug-ins that extend the transform pipeline.
onError / onWarn	console-by-default	Where compile errors and warnings go.
ssr / inSSR	false	Whether to use SSR-flavored output (delegates to @vue/compiler-ssr in compileTemplate).
scopeId	none	Adds a data-v-xxxx attribute to elements (for scoped CSS).

The parserOptions subset (packages/compiler-dom/src/parserOptions.ts) handles HTML-specific behaviors: isVoidTag, isPreTag, getNamespace, decodeEntities.

SFC compile options

compileScript in @vue/compiler-sfc accepts SFCScriptCompileOptions:

Option	Purpose
id	Unique component ID (used for scoping).
inlineTemplate	When true, the template is compiled inside the script's setup() so identifier bindings can be referenced directly.
templateOptions	Compile options forwarded to the template.
propsDestructure	Enable / disable reactive props destructuring (default since 3.5).
genDefaultAs	Renames the SFC's default export — useful for HMR.
babelParserPlugins	Extra Babel parser plugins for non-default TS/JS syntax.

compileStyle accepts options for scoped CSS, modules, asset URL handling, preprocessors. See packages/compiler-sfc/src/compileStyle.ts.

Common configuration patterns

Vite project, no Options API:

// vite.config.ts
import vue from '@vitejs/plugin-vue';

export default defineConfig({
  plugins: [vue()],
  define: {
    __VUE_OPTIONS_API__: false,
  },
});

Server with hydration mismatch details:

define: {
  __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: true,
}

Custom delimiters:

const app = createApp(MyComp);
app.config.compilerOptions.delimiters = ['${', '}'];

(Only works in full builds; for SFCs use the templateOptions in your bundler plugin.)