OrchardCMS / OrchardCore

Orchard Core is an open-source modular and multi-tenant application framework built with ASP.NET Core, and a content management system (CMS) built on top of that framework.
https://orchardcore.net
BSD 3-Clause "New" or "Revised" License
7.43k stars 2.4k forks source link

Upgrade Vue to 3.0 #7110

Open agriffard opened 4 years ago

agriffard commented 4 years ago

Migrate the ResourceManifest, the dependent scripts, the ContentPicker and the LocalizationContentPicker to use vue.js 3.0

https://www.npmjs.com/package/vue/v/3.0.0

/cc @Skrypt

jptissot commented 4 years ago

https://github.com/SortableJS/Vue.Draggable/issues/881

Skrypt commented 4 years ago

Major version = breaking changes.

jptissot commented 4 years ago

We should wait a couple months for the ecosystem to migrate to it and fix the bugs.

Skrypt commented 4 years ago

Or at least if we migrate do manual testing to make sure nothing is breaking. I'm pretty sure it will break all the draggable components.

agriffard commented 4 years ago

SortableJS/Vue.Draggable#881

There is a https://www.npmjs.com/package/vue-draggable-next package available.

Not sure if we should switch to this one to be compatible with vue 3?

jptissot commented 4 years ago

I would wait a couple months for others to test the vue components for us 😁

Skrypt commented 4 years ago

Well create the PR guys if you think it could potentially work. But test a lot before merging.

Piedone commented 2 years ago

@agriffard any specific reason you closed this? Eventually, we should upgrade. And since then, Vue.Draggable is also upgraded: https://github.com/SortableJS/Vue.Draggable/issues/942

agriffard commented 2 years ago

There is no CDN available for the latest version: https://www.npmjs.com/package/vuedraggable/v/4.1.0

The url they give returns a 404: https://github.com/SortableJS/vue.draggable.next#with-direct-link

<script src="//cdnjs.cloudflare.com/ajax/libs/Vue.Draggable/4.0.0/vuedraggable.umd.min.js"></script>

Piedone commented 2 years ago

That's a bug in Vue.Draggable then that we need before this can be addressed. However, any reason why not keep this issue open?

Piedone commented 2 years ago

Hmm, there's https://github.com/SortableJS/Vue.Draggable and https://github.com/SortableJS/vue.draggable.next. The latter is the project going forward with Vue v3. It appears to have restarted versioning (though this is inconsistent on GitHub/NPM vs the CDN) and the new CDN is here: https://unpkg.com/vue-draggable-next@2.1.1/dist/vue-draggable-next.global.js See: https://github.com/SortableJS/vue.draggable.next/issues/64

Piedone commented 10 months ago

We need this ASAP now, since Vue 2 reaches its EOL by the end of the year: https://v2.vuejs.org/lts/.

Skrypt commented 10 months ago

You have some WIP there: https://github.com/OrchardCMS/OrchardCore/pull/14256

Piedone commented 10 months ago

Awesome! Do you need some help with that?

Skrypt commented 10 months ago

Yeah, any help would be appreciated. Basically my PR adds the ability to keep Vue 2 and Vue 3 in the solution ; so that we can split the tasks in different PR's afterward. Though, I still need to migrate the media library picker component to be able to say that the PR is a complete Media Library upgrade.

Let me know if you need more details we can do a Teams call.

Skrypt commented 10 months ago

Another suggestion would be to convert all of these to Blazor components. Get rid of the Vue dependency and find something else than the JQuery UI upload component to do this. I upgraded the Vue component to use it as a standalone app for a different project but I definitely would see this rewritten as a Blazor component. @sebastienros

Piedone commented 10 months ago

I'd upgrade Vue instead of a more drastic change, at this point at least. Also, the Vue dependency itself needs to be upgraded in any case, so module authors can depend on the new version.

Skrypt commented 10 months ago

The way the OC admin UI is built is to not depend on Vue at all. Just Bootstrap and some custom Javascript. It is possible to keep Vue 2 and Vue 3 in the resourceManager for the time that people will migrate their custom modules to Vue 3.

I think most of the work is about migrating the Media Library and the CORS module UI. Of course now that we have a good migration of the Media Library here I'd say just push to migrate everything else for now. We could alternatively create a small Blazor component for the OptionEditor ... we have the choice as this is a smaller component. But definitely agree that the Media Library would take way more time to Blazorize so nothing planned in the short term for this.

Vue dependency itself needs to be upgraded in any case

I think it needs to be added in the resourceManager along with the Vue 2 dependency instead.

Skrypt commented 10 months ago

Also wanted to have a clear opinion about Blazor components and OC from @sebastienros first. That's why I pinged him.

Piedone commented 10 months ago

Yes, we definitely would need to keep the v2 resource too.

agriffard commented 9 months ago

/cc @Skrypt

Piedone commented 9 months ago

Where was this done @agriffard? https://github.com/OrchardCMS/OrchardCore/pull/14256 is open.

agriffard commented 9 months ago

Closed in favor of https://github.com/OrchardCMS/OrchardCore/pull/14256

Piedone commented 9 months ago

But that's a PR, we still need an issue to keep track of the request.