Provide version that's Vue 3 compatible

[sinner]

It Doesn't have compatibility with the Vue 3 beta version. When the plugin is loaded it throws an error:

• Uncaught TypeError: Vue.extend is not a function

[LinusBorg]

Yeah. This is a Vue 2 plugin. I'll release a vue 3 compatible version in time.

[LinusBorg]

Sidenote: Depending on your usecase you might not need portal-vue anymore as Vue 3 has a basic Portal in core now, named <teleport />.

https://github.com/vuejs/rfcs/blob/master/active-rfcs/0025-teleport.md

[mariusa]

@LinusBorg

Sidenote: Depending on your usecase you might not need portal-vue anymore as Vue 3 has a basic Portal in core now, named <teleport />.

https://github.com/vuejs/rfcs/blob/master/active-rfcs/0025-teleport.md

Will you still provide a vue3 compatible version, or users wanting v3 will need to migrate code to teleport ? Would you kindly provide a migration guide?

[LinusBorg]

I'll provide a Vue 3 compatible version, as <teleport> doesn't offer everything that portal-vue does - but the former has none of the caveats/downsides of the latter as well.

So people who can use <teleport> for their usecase should do so.

[yoyoys]

@LinusBorg teleport can't work with transition, this cause some transition(leave animate) broken.

[mariusa]

Instead of duplicating the effort, improving teleport would be better instead of porting portal-vue to vue3? Or maybe have teleport plugins.

As a developer, I'd also want one component which works well enough, instead of several, each having various downsides.

[LinusBorg]

Teleport is already designed to solve the 80% use case, not all of Portal-Vue. If that covers your needs, by all means use that.

Portal-Vue does a few more things that teleport doesn't, so if you need those 20%, use Portal-Vue.

As those 20% of additional use cases make up for 80% of portal-vue's weight, those will not make it into core.

I'll try and build the new version on top of teleport so there's no duplication going on.

[LinusBorg]

@LinusBorg teleport can't work with transition, this cause some transition(leave animate) broken.

That should.be addressed as a bug in the Vue 3 repo then.

[yoyoys]

@LinusBorg teleport can't work with transition, this cause some transition(leave animate) broken.

That should.be addressed as a bug in the Vue 3 repo then.

I think this is not only a bug,
because teleport is DOM-based, it could not send any component to transition child, bug portal-target can be a good target.

@LinusBorg I'll try and build the new version on top of teleport so there's no duplication going on.

but this is a good idea :)

[LinusBorg]

because teleport is DOM-based, it could not send any component to transition child,

I'm not sure what you mean here.

I again suggest to try and open an issue about your problem in the Vue 3 Repo. I can tell you that I would expect this to work - and I wrote the RFC for <teleport>.

[anhoev]

Hi, do you have an exact plan for release a version for vue 3 ? And what is about performance for vue 3 version , i see the lack of performance by vue 2 version.
And i think about the consistent name with vue's teleport like teleport-slot , maybe is easier for developers to understand.
I think it is better if your full version can be intergrated in core, because the vue 3 has tree shaking .So the developers don't need to worry about the bundle size, and the core team can maintain it better. I see the big value by your plugin to decouple the code in some cases like widget or cms system. Maybe you can write a RFC to persuade the core team .

[loren138]

Following/joining, I have an issue with the portal target living as a sibling of the portal (portal sends content of the selected article to the sidebar), which isn't supported by teleport:

vuejs/core#992 (comment)

The target element cannot be a part of the same component... It needs to be outside of <div id="app">.

vuejs/core#1705 (comment)

[Vue warn]: Failed to locate Teleport target with selector ".cell2". Note the target element must exist before the component is mounted - i.e. the target cannot be rendered by the component itself, and ideally should be outside of the entire Vue component tree.

I'm pretty sure I could use some hacking to force vue to render the sidebar and then in the nextTick populate the articles so the teleport target exists before an article, but I'd rather the portal handle waiting an extra render cycle as this one does.