Vue.js Upgrade Guide

Compare Vue.js versions and see exactly what changes, what requires action, and what you can start using.

From → To

3Changes

0Breaking

0Actions

1Features

1Migration tools

New Features

onServerPrefetch added to the Composition API

featurelow impact

Vue 3.1 adds onServerPrefetch(), allowing Composition API components to register asynchronous work that should be resolved during server-side rendering.

Aftervue

<script>
import {
  ref,
  onServerPrefetch
} from 'vue'

export default {
  setup() {
    const data = ref(null)

    onServerPrefetch(async () => {
      data.value = await fetchData()
    })

    return {
      data
    }
  }
}
</script>

Migration

No migration is required. Use onServerPrefetch() when Composition API logic needs to fetch or prepare asynchronous data during server-side rendering.

Official sources

Vue 3.1.0 Release ↗

Tooling

SFC compiler source map support improved

toolinglow impact

Vue 3.1 includes compiler improvements for generating and propagating source maps for Single-File Components.

Migration

No migration is required. Tooling built on @vue/compiler-sfc can benefit from the improved source map support.

Official sources

Vue 3.1.0 Release ↗

Migration Tools

Migration Build for Vue 2 applications

migrationmedium impact

Vue 3.1 introduced the @vue/compat migration build, which provides Vue 2 compatible behavior with runtime warnings for APIs and behaviors that need to be migrated.

Migration

Projects migrating from Vue 2 can temporarily alias vue to @vue/compat and use compatibility warnings to migrate incrementally. The compatibility build is intended as a migration aid and should be removed after migration is complete.

Official sources

Vue 3 Migration Build ↗ Vue 3.1.0 Release ↗