📦 ❗️Vue 3 Migration - NC33 Roadmap

[sorbaugh]

Apps in server repository

• Prepare Vue 3 migration by having 2 build processes one for Vue 2 and one for migrated Vue 3 apps
  • [x] Migrate to ESLint v9 to make linting on Vue 3 work ( https://github.com/nextcloud/server/pull/55495 )
  • [x] Prepare migration by splitting the build process ( https://github.com/nextcloud/server/pull/55432 )
• Moving forward with necessary migrations to Vue3, the following apps should be migrated. (names in parenthesis are respective app maintainers)
  • [x] dav ( https://github.com/nextcloud/server/pull/55951 )
  • [x] files_reminders ( https://github.com/nextcloud/server/pull/56694 )
  • [x] files_trashbin ( https://github.com/nextcloud/server/pull/56439 )
  • [x] files_versions ( https://github.com/nextcloud/server/pull/55965 )
  • [x] sharebymail ( https://github.com/nextcloud/server/pull/55432 )
  • [x] twofactor_backupcodes ( https://github.com/nextcloud/server/pull/56067 )
  • [x] user_ldap (https://github.com/nextcloud/server/pull/56570)
  • [x] user_status ( https://github.com/nextcloud/server/pull/56544 )
  • [ ] comments ( @edward-ly )
  • [ ] dashboard ( @julien-nc )
  • [ ] federatedfilesharing (📁 team)
  • [ ] files (📁 team)
  • [ ] files_external (📁 team)
  • [ ] files_sharing (📁 team)
  • [ ] oauth2 (📁 team)
  • [ ] profile (📁 team)
  • [ ] systemtags ( @Antreesy )
  • [ ] theming (📁 team)
  • [ ] updatenotification ( @JuliaKirschenheuter )
  • [ ] weather_status ( @julien-nc )
  • [ ] workflowengine ( @blizzz )
  • [ ] core (this should be done close before or after the files app)
  • [ ] settings
    • QUESTION: shall we for simplicity split this app into a new appstore app + separate settings ?

Ideally all files apps in "one go". Maintaining both Vue versions duplicates dependencies which has a performance impact.

External applications

• [x] Migrate end_to_end_encryption to Vue 3 ( https://github.com/nextcloud/end_to_end_encryption/pull/1149 )
• [ ] Migrate files_antivirus to Vue 3
• [ ] Migrate Teamfolders to Vue 3
  • This one would add a bulk of improvements, such as being able to get rid of pagination, which doesn't work well with Search.

---

How to migrate apps?

1. Migrate the code to Vue 3
2. Remove symlink from build/frontend-legacy/apps
3. Remove entry from build/frontend-legacy/webpack.modules.cjs
4. Add symlink to build/frontend/apps
5. Add entry to build/frontend/vite.config.ts

If the migrated app has dependencies not already present in the Vue 3 version move the dependencies to the root package.json (and remove from build/frontend-legacy if no longer needed for the Vue 2 apps). This way we can throw away everything from build/frontend* once done.

[isZYKerman]

Will the backend also be re-crafted as the oCIS of ownCloud?

[artonge]

Will the backend also be re-crafted as the oCIS of ownCloud?

This issue is only about a dependency bump, so no re-craft. And as a general answer, we are not planning any re-craft, front or back. Previous examples as shown that this is a bad idea for projects the size of Nextcloud.

[isZYKerman]

I see. Thank you very much!

[ShGKme]

1. Migrate the code to Vue 3

Do you plan to migrate "with the minimal required changes" or "as much as possible", going to <script setup lang="ts">, migrating from Vuex to Pinia etc.?

[ShGKme]

Also, it is possible to prepare an app for the migration before the migration, making the diff with Vue 3 as small as possible. For example:

• Using @nextcloud/vue v9 forward compatible API
• Migrating from deprecated Vue features like filters, prototype patching like Vue.prototype.$t = t
• Or even <script setup lang="ts"> and Pinia

This may help with backporting changes from the Vue 3 version to Vue 2 versions later having fewer changes places. Does it make sense? Or migration in a single PR/commit is fine?