DEV Community

Cover image for Vue 3 is Coming!

Vue 3 is Coming!

Gaute Meek Olsen on April 08, 2020

I have been playing around with Vue 3, which is really cool. So let me share some of what I have learned. According to their roadmap, they have pla...
Collapse
 
sonicoder profile image
Gábor Soós

Nice summary!

Do you know anything about what will happen with testing? vue-test-utils is broken with Vue 3.

In the meantime, I'm also experimenting with Vue on the TodoMVC app. Good to see others are doing it also.

Collapse
 
gautemeekolsen profile image
Gaute Meek Olsen

Looks like vue-test-utils for Vue 3 has reached alpha today :) Check out vue-test-utils-next

Collapse
 
sonicoder profile image
Gábor Soós

Thanks, upgraded, it works with minor bugs

Collapse
 
gautemeekolsen profile image
Gaute Meek Olsen

Thank you!

I'm not quite sure, I haven't looked into it.

Nice, thank you for sharing the Todo app :D

Collapse
 
mburszley profile image
Maximilian Burszley

So filters are gone with v3? Is that a breaking change?

Collapse
 
gautemeekolsen profile image
Gaute Meek Olsen

Yes, it is. The main reason is that JavaScript has this ESNext Proposal: The Pipeline Operator. This may or may not happen, but if JavaScript introduces this, it would break Vue I think. So they are thinking ahead and keeping what's inside the brackets to only be valid JavaScript.

Collapse
 
mburszley profile image
Maximilian Burszley

Interesting; thanks for that link. Is the proposal gaining traction? I've never heard of it before this.

Thread Thread
 
gautemeekolsen profile image
Gaute Meek Olsen

I'm not quite sure actually, first time hearing about it myself :)

Collapse
 
sidecut profile image
Jim R

The pipe syntax is just a way of composing functions. That syntax has gone away in favor of the familiar way of composing functions.

So x | y | z can be rewritten as z(y(x)).

That being said, I think there's a strong argument to be made for keeping the filter pipe syntax. It's used in unix, a lot of functional languages, Vue2, other JS frameworks, etc. It's a terrific idea.

Collapse
 
mburszley profile image
Maximilian Burszley

I know it's purpose. I don't know what they gain by removing it. It's also quite popular in jinja2

Collapse
 
zearin profile image
Zearin

Well, they are going with a new major version in Vue 3—so, breaking changes are to be expected.

Collapse
 
mburszley profile image
Maximilian Burszley

Expected, but not mandatory. SemVer also reserves bumping major versions for a sweeping feature introduction (like functional components).

Collapse
 
sidecut profile image
Jim R

Is this a typo, or are both v-enter and v-leave renamed to the same thing?

"In Vue 3 v-enter is renamed to v-enter-from and v-leave to v-enter-from."

Collapse
 
gautemeekolsen profile image
Gaute Meek Olsen

It was a typo. Thank you for correcting me :) I have updated the article now.

  • Rename the v-enter transition class to v-enter-from
  • Rename the v-leave transition class to v-leave-from
Collapse
 
sidecut profile image
Jim R

Thanks! :)

The timing of your post was terrific. My boss saw it and as a result suggested we use Vue 3 on an upcoming project.

Collapse
 
gautemeekolsen profile image
Gaute Meek Olsen

Vue 3 is now in Beta! 🥳