CODEWITHSUNDEEP
vue.jsvuejs2vuejs3
Simon Thiel
Simon Thiel

Reputation: 3285

Best practices for easy migration from VueJS2 to VueJS3?

I am currently developing a web frontend of an enterprise application with vuejs 2 and vuetify 2. The plan is to migrate to Vuejs 3 after the release.

Are there any coding pattern which should be avoided now for any easy future migration to vuejs 3?

The github for the Vue 3 release road map says:

High level API remains as close to 2.x as possible. Breaking changes only made where necessary, and will be communicated through the RFC process. (https://github.com/vuejs/roadmap)

Upvotes: 5

Views: 2958

Answers (4)

Simon Thiel
Simon Thiel

Reputation: 3285

The composition API seems to be one of major new features.

The Composition API is a set of additive, function-based APIs that allow flexible composition of component logic.

See here for details: https://vue-composition-api-rfc.netlify.com/

example code

<template>
  <button @click="increment">
    Count is: {{ count }}, double is: {{ double }}
  </button>
</template>

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

export default {
  setup() {
    const count = ref(0)
    const double = computed(() => count * 2)

    function increment() {
      count++
    }

    return {
      count,
      double,
      increment
    }
  }
}
</script>

Upvotes: 1

SeyyedKhandon
SeyyedKhandon

Reputation: 6093

you can see what is dropped and what is currently under develop and what is accepted in the roadmap in from here:

first you should know class compoenent is being dropped: https://github.com/vuejs/rfcs/pull/17#issuecomment-494242121 (which is well answered in what will happen for vuejs projects based on class components in vuejs v3.0? but it will work in vue3).

this is the vuejs roadmap which is very helpfull for watching its future implemenetations: https://github.com/vuejs/vue/projects/6

enter image description here

and here is a practically Q&A in converting vue2.x options to vue3.x like composition api(infact using vue-composition api)

odd problems in Convert Vuejs Typescript Options to Composition Api

which is based on https://vue-composition-api-rfc.netlify.com/api.html and this free video (thanks to maximilian)"https://www.youtube.com/watch?v=V-xK3sbc7xI" will be helpfull for you if you want to migrate your vue2 to vue3.

Upvotes: 1

Paleo
Paleo

Reputation: 23692

Are there any coding pattern which should be avoided now for any easy future migration to vuejs 3?

Yes. Class-based components should be avoided. They won't be marked as obsolete, but it won't be possible to use the composition API with them. Class components are not anymore the future of Vue.

On this subject:

Upvotes: 5

Eder D&#237;az
Eder D&#237;az

Reputation: 2071

From what I've read in the RFC and a couple of videos in Vue Mastery (https://www.vuemastery.com/courses/vue-3-essentials/why-the-composition-api), there won't be breaking changes, they're just adding new features and not removing old ones.

Probably I wouldn't fully adopt Typescript or heavily rely on Vue Mixins, because Vue3's composition API will improve both features.

Upvotes: 1

Related Questions