Vue 3: mid 2020 status update

[yyx990803]

Vue 3: Mid 2020 Status Update

Many of our users have been asking this question: when will Vue 3 be ready? We have refrained from giving a definitive answer because predicting software delivery time is hardly ever accurate. As a non-profit-driven project, we wanted to focus on writing good software instead of hitting deadlines. However, it's been a long wait, and we know the uncertainty can make it difficult to make plans with Vue 3. So here we would like to provide some general guidance and detailed status updates to help our users adjust their expectations and plans accordingly.

The majority of the time spent on Vue 3 has been invested into designing and building a solid core, which brings about many exciting improvments (you can read more about it here). However, in order to mark the whole framework "ready", it's not just about the core. We also need to have compatible versions of the supporting libraries (Vue Router, Vuex, test utils), tools (CLI, eslint plugin, browser devtool extensions, IDE extensions), and documentation (both for new users and migration). While we have been working hard on all of these parts, it is very difficult to accurately predict a timeline given the amount of effort and coordination it takes to have all the pieces fit together. We originally hoped to have Vue 3 released in the first half of 2020, but we have to adjust it given the current progress. Our current target dates are mid July for the RC (release candidate) and early August for the official release of 3.0.

Decision Tree

It doesn't mean you cannot start using Vue 3 today though. Most of the framework parts are now in either beta or alpha, and the core itself has been extensively tested by our early adopters. The only thing that blocks us from going into RC is the browser devtools extension (which is being actively worked on at this moment). All the significant changes have been landed and documented in RFCs and there are no more planned breaking changes. If you've been waiting to get onboard with Vue 3, here is a decision tree to help you plan accordingly:

IWantVue3()

async function IWantVue3() {
  await read(`https://github.com/vuejs/rfcs/pulls?q=is%3Apr+is%3Amerged+label%3Acore+-label%3Arevoked+-label%3A2.6+sort%3Acomments-desc`)

  if (isTrue("I just want to play with Vue 3"))) {
    // If you just want to try Vue 3 out - you can do it right now with Vite.
    // Vite (https://github.com/vitejs/vite) is a new dev/build tool that we
    // created that is lighter, faster and produces smaller bundles. It works
    // with Vue 3 out of the box.
    run(`npm init vite-app hello-vue3`)
    return
  }

  if (isTrue("I am planning to use Vue 3 for a new project")) {
    if (isTrue("I need IE11 support")) {
      await IE11CompatBuild() // July 2020
    }
    if (isTrue("RFCs are too dense, I need an easy-to-read guide")) {
      await migrationGuide() // July 2020
    }
    if (isTrue("I'd rather wait until it's really ready") {
      await finalRelease() // Targeting early August 2020
    })
    run(`npm init vite-app hello-vue3`)
    return
  }

  if (isTrue("I am planning to upgrade an existing Vue 2 project")) {
    await IE11CompatBuild()
    await migrationGuide()
    await ecosystem(
      // this is the tricky part: if you have an existing, non-trivial Vue 2
      // app, you likely are using some dependencies that are not yet
      // Vue-3-compatible, for example meta frameworks like Nuxt, or UI
      // component libraries like Vuetify. If that's the case, our suggestion
      // is don't be in a hurry to upgrade. It *will* take some time for the
      // ecosystem to catch up.
      // Also note that you can start using Vue Composition API in Vue 2 today
      // via https://github.com/vuejs/composition-api - we are also going to be
      // backporting compatible Vue 3 features to 2.x once 3.0 is out.
    )
    return
  }

  if (isTrue("I am the author of a Vue ecosystem library")) {
    // It's time to make your lib Vue 3 compatible!
    return
  }
}

Status of Major Framework Parts

Vue 3 Core

• 
• Github
• RFCs

Vue 3 core has been in beta for over two months now. We have merged all planned breaking change RFCs, and there are no further breaking changes planned before official 3.0 release.

Thousands of early adopters have been using it for new projects and have helped us identify and fix many bugs and behavior inconsistencies with Vue 2. At this stage, we believe Vue 3 core is quite stable and ready for RC.

Vue Router

• 
• Github
• RFCs

We still have a few minor router hook behavior consistency issues with vue-router@3.x, but these are the only things that is blocking the router from being marked as Beta. The router is usable for new, non-critical projects.

Vuex

• 
• Github

The only difference between Vuex 4.0 and 3.x is that it's Vue 3 compatible! It is ready to enter RC together with Vue 3 core.

Vue CLI

Vue 3 support in Vue CLI is currently provided via the vue-cli-plugin-vue-next plugin. You can scaffold a new project and then run vue add vue-next to switch to Vue 3. Vue 3 will become a option in the project creation process when it reaches RC.

Note if you are not particularly attached to webpack and IE11 support, you can also start a Vue 3 project with Vite.

JSX Support

There are currently two JSX transform implementations for Vue 3 with slightly differing syntax (for Vue specific features):

• vueComponent/jsx
• HcySunYang/vue-next-jsx

We are using this thread to unify the design and land on an official specification of how Vue features should be handled in JSX. If you use Vue with JSX, please provide your feedback in that thread.

Other Projects

Project	Status
vue-devtools	WIP (beta channel with Vue 3 support in early July)
eslint-plugin-vue	[Github]
@vue/test-utils	[Github]
vue-class-component	[Github]
vue-loader	[Github]
rollup-plugin-vue	[Github]

[lucduong]

Really thanks @yyx990803 to announce us about the progress of Vue 3. Waiting for good release this Aug.

[kamalhm]

It's okay, the wait will be worth it

[akbarsaputrait]

thank you for the announcement, @yyx990803 💚💪🏼

[xerosanyam]

Apart from the update, really liked the Decision tree! <3

[xiaoxiangmoe]

"I need TypeScript type checking support for template"

[arpowers]

The biggest hang-up right now is the missing documentation!

I can read codebases with the best of them, but it doesn't explain the "intentional usage" of an undocumented feature.

Some features, in particular SSR, have had some major changes but are unusable until we know how they are meant to work.

Tl;Dr: without docs, the risk of "doing it wrong" is a deal killer.

[CyberAP]

@yyx990803 what's the recommended way for plugin authors to support both Vue 2 and 3?

[asafyish]

What about vetur ? it's almost a requirement when developing in VSCode.

[sonicoder86]

A little addition to the "I just want to play with Vue 3" part:

I'm maintaining a showcase playground with code examples for the new features and a curated list of articles/courses targeting Vue 3. Feel free to contribute if something is missing from them.

[idevwork]

Great! 💪

[Ultra-Code]

Just love Vue 3 soo much , I have been playing around with the composition api in a vue 2 project and it awesome. I just can't wait for August for the official release. Great Work by all the contributors and the community. Let's keep making vue better

[elithecho]

Thanks for the great work! The only thing stopping me is API changes at this point up until RC.

[lmiller1990]

@CyberAP regarding plugins that need to support Vue 2 and Vue 3, the way this was handled from Vue 1 to Vue 2 was just having a separate branch and a note in the README. This is how Vuex is handling this right now. You just deploy a separate version on NPM using a tag (--tag [version]).

I plan to maintain my plugins Vue 2 compat for the next 18 months, then put them into migration mode.

Likely, you leave the main branch as Vue 2, until you feel like most of the issues and users are on Vue 3. Many old-school projects (eg vue-multiselect) still have a 1.x branch as well.

So far, Vue 3 + Router + Vuex + Utils is feeling pretty on point in some small projects I've been working on! Great job everyone.

@asafyish Vetur (for Vue 2) works pretty well with Vue 3 as is (some missing features, like it will warn you about a root node which is no longer required in Vue 3). Aside from small things like that, you can still get TS inference etc without problem. It also looks like the Pine (the maintainer, handle octoref) is doing a ton of work around Vetur lately as well.

[kiaking]

Same for Vuex here. We'll probably create 3.0 branch and swap with current 4.0 branch. Vuex 3 will be supported as long as Vue 2 is supported 👍

[flozero]

Even if it's a bit longer the most important is informations thank's a lot ! 👍

[StevieTaylor]

Evan You , Immortal god .

[helloCheng09]

马上打开有道词典翻译一下。大神牛逼！

[vanoneang]

Thanks to the whole team for your efforts!

[loiccc]

Yeah ! Good news ! Is anyone have test to switch an existing app vuejs2 to vuejs3 recently ? Because we try, want it was dirty (mostly imported libraries like Element, etc)... Is anyone have good resources on migration ?

[vanoneang]

Yeah ! Good news ! Is anyone have test to switch an existing app vuejs2 to vuejs3 recently ? Because we try, want it was dirty (mostly imported libraries like Element, etc)... Is anyone have good resources on migration ?

I encountered the same issue, and now I am going to refactor Element-UI. Seem the Element official has no plan to upgrade Vue3.

[ljq2731]

Thanks You All

[guicheffer]

That's really really great stuff! Looking forward to the final release 🙂

[BigGress]

Final release...It's time to make new thing😉

[mariusa]

Looking forward to migration guide! Where could we find a draft version, to provide feedback on it?

 if (isTrue("I am planning to upgrade an existing Vue 2 project")) {
    await IE11CompatBuild() //this is not required. 
   //We want to upgrade existing Vue 2 projects and drop IE support. You might want to ask how many still need IE support for Vue3 version.

[sandiprb]

@yyx990803 For once and all let's do this here! https://isvue3readyyet.com/

Repo here: https://github.com/sandiprb/isvue3readyyet

[maximilianschmid]

Great!

[rasliche]

Great update. Good work takes time.

[antfu]

what's the recommended way for plugin authors to support both Vue 2 and 3?

@CyberAP Saw your comment and I made a library for that just now - vue-demi 😆

[rnenjoy]

Thanks for all the great work everyone!!

[kytosai]

I hope vetur extension can get more attention. Currently, there are too many problems with vetur that make the experience of developing vue not good

Many important issues are not solved quickly and thoroughly

[Jexordexan]

I cant parse the code past line 5 due to a syntax error, please advise:

  if (isTrue("I just want to play with Vue 3"))) {

[socketbear]

얼릉 Vuejs 3.0 정식 버전을 맛보고 싶네요! Awesome!

[qiaoqiao10001]

amazing ， awesome ， so fast ; waiting for Vuact;😃

[davision]

You guys rock! Can't wait for new features and performances!

[csyanghan]

Amazing ! Thanks to you and your team 's great efforts to bring us this exciting features !!

[rhengles]

Here's an example of using Vue 3 with Vue-Router, lazy async components and without webpack:

https://github.com/arijs/vue-next-example

[Giorgiosaud]

the function is absolutely fabulous

[zhouLion]

"I need TypeScript type checking support for template"

use this IDE -- VSCode install this extension -- vetur set this config -- vetur.experimental.templateInterpolationService = true

[minazukie]

console.log("Great work!");

[they-cloned-me]

dieHardVueFan

So long as I never have to use reactjs, I will wait!

Do what you must do! 🥰

Courage to y'all ✌🏿

[victornpb]

Awesome! I’m definitely interested in Vite!

[kyleqqq]

Greate job, so see you in Aug.

[wangly19]

8月见，遇见更好的Vue。

[reaink]

8月见，遇见更好的Vue。

[pluscai]

Just waiting for you! Thanks for your team

[VictorCam]

YYESSS!! Can't wait!!!! :D

[stephenjason89]

Thank you for the great work 😄 Waiting for laravel, vuetify and other dev tools support My early test on laravel with vue 3 was working but only with webpack. Would want to see laravel mix integrated thank you 😄

[ThitipongInlom]

Good news

[tinashekadiki]

Thank you. When are we getting a native delivery vue solution?

[eshimischi]

Congratulations on RC 1, guys!