●Change8

Migrating to Vue v3.6.0-alpha.1

Version v3.6.0-alpha.1 introduces 5 breaking changes. This guide details how to update your code.

Released: 7/12/2025

5
Breaking Changes
4
Migration Steps
9
Affected Symbols

⚠️ Check Your Code

If you use any of these symbols, you need to read this guide:

effectScopetoRefsnextTickcreateVaporAppcreateAppvaporInteropPluginVaporDirectiveuseSlotsuseProps

Breaking Changes

●Issue #1

Implicit instance properties like `$slots` and `$props` are not available in Vapor template expressions. Access them via `useSlots()` and `useProps()` respectively.

●Issue #2

Options API is not supported in Vapor Mode. Use `<script setup>`.

●Issue #3

`app.config.globalProperties` is not supported in Vapor Mode. Use provide/inject or external state management.

●Issue #4

`getCurrentInstance()` returns `null` in Vapor components. Use `getCurrentInstance()` only in VDOM components.

●Issue #5

`@vue:xxx` per-element lifecycle events are not supported in Vapor Mode. Use standard component lifecycle hooks or `watchEffect`.

Migration Steps

  1. 1
    To opt-in to Vapor Mode, add the `vapor` attribute to your `<script setup>` tag: `<script setup vapor>`. This is only supported for `<script setup>` components.
  2. 2
    To use Vapor components in a VDOM app, install the `vaporInteropPlugin`: `createApp(App).use(vaporInteropPlugin).mount('#app')`.
  3. 3
    If using Vapor Mode, access `$slots` and `$props` via `useSlots()` and `useProps()` respectively.
  4. 4
    For custom directives in Vapor Mode, adapt to the new `VaporDirective` interface, using reactive getters for values and returning cleanup functions if necessary.

Release Summary

This release introduces Vapor Mode, a new compilation mode for Vue SFCs focused on bundle size and performance. It also includes several performance improvements and bug fixes in the reactivity and scheduler systems.

Need More Details?

View the full release notes and all changes for Vue v3.6.0-alpha.1.

View Full Changelog