Migrate to Vue 3

[raimund-schluessler]

This issue exists to track the migration towards Vue 3.

There are multiple things that should be done before any migration can take place. They won't break compatibility with Vue 2, but will help with the later migration towards Vue 3.

Preparations:

• Migrate to webpack 5 Update to webpack 5 #2593
• Upgrade to @nextcloud/eslint-config@7 Upgrade @nextcloud/eslint-config to 7.0.2 #2594
• Upgrade to @nextcloud/stylelint-config@2 Update @nextcloud/stylelint-config to 2.1.2 #2595
• Upgrade to cypress@9.5 Bump cypress from 6.8.0 to 9.5.3 #2613
• Migrate to @fontsource/roboto Migrate to @fontsource/roboto #2598
• Migrate from vue-jest to @vue/vue2-jest Migrate to @vue/vue2-jest #2599
• Migrate from node-sass to sass Migrate from node-sass to sass #2631
• Migrate to common webpack configuration @nextcloud/webpack-vue-config Use the common webpack configuration #2625
• Migrate from v-tooltip to floating-vue@1 (the library got renamed and rewritten)
• Definitely more stuff

Actual migration to Vue 3 #3692:

• Migrate from floating-vue@1 to floating-vue@2
• Migrate from @vue/vue2-jest to @vue/vue3-jest
• Migrate from @cypress/vue@2 to @cypress/vue@3
• Migrate from splitpanes@2 to splitpanes@3
• Migrate from vue-multiselect@2 to vue-multiselect@3
• Migrate from vue-color@2 to @ckpack/vue-color@1
• More dependency migrations
• Do the actual migration to Vue 3
• ...
• Profit

[juliushaertl]

robcresswell/vue-material-design-icons#230 might be a possible blocker as functional components are used there and are incompatible according to https://v3.vuejs.org/guide/migration/migration-build.html#incompatible

[Pytal]

Since we're using vue-ripple-directive for the Button component #1808, linking this issue PygmySlowLoris/vue-ripple-directive#32 for future reference 🖖

[robcresswell]

@juliushaertl Heh, I can see my slowness updating this is causing issues. I have a free weekend, I'll get this fixed. I was quite amazed to see nextcloud using my little plugin, that was nice 😊

[dartcafe]

I would like to bumb this issue. At least for the app developers it would be a valuable information, if any roadmap exists or will be released, since the migration of most NC apps will not be done in a sprint. There might some more repos affected, like https://github.com/nextcloud/webpack-vue-config.

The blocker of robcresswell/vue-material-design-icons#230 seems to be removed.

[robcresswell]

Yes! Sorry, I didn't update here. My lib supports Vue 3 now. Apologies again for holding you up.

[raimund-schluessler]

I updated the original issue #2154 (comment) to sketch a possible migration path to Vue 3. Feel free to update and adjust.

[zak39]

Hi 👋

I ask for news 🙂
Is the migration to vue3 going well?

[raimund-schluessler]

Hi 👋

I ask for news 🙂 Is the migration to vue3 going well?

There is one final PR pending, see #4842. If this is merged we could aim for an alpha release of nextcloud/vue with vue 3 support.

[raimund-schluessler]

The last component was migrated with #4976.