Migrate to Vue3

[syuilo]

Summary

Vue2をVue3に移行。
それに合わせて内部の大幅なリファクタリングも行っています。

将来的には全てのコンポーネントをComposition APIを利用したものに移行したいが、このPRでは基本的にやらない

Tasks

• filters - https://v3.vuejs.org/guide/migration/filters.html#overview
• directives - https://v3.vuejs.org/guide/migration/custom-directives.html#overview
• async component - https://v3.vuejs.org/guide/migration/async-components.html
• functional component
• render function api - https://v3.vuejs.org/guide/migration/render-function-api.html
• watch - no longer supports dot-delimited string paths, use a computed function as the parameter instead
• Migrate v-model - https://v3.vuejs.org/guide/migration/v-model.html#migration-strategy
• Some transition classes got a rename - https://v3.vuejs.org/guide/migration/transition.html#overview
• beforeDestroy destroyed --> beforeUnmount unmounted
• Defining Custom Events - https://v3.vuejs.org/guide/component-custom-events.html#defining-custom-events
  • click
  • mouseover
  • etc
• events $on $once $off
• remove Vue.set
• ref with v-for - https://v3.vuejs.org/guide/migration/array-refs.html, ref doesn't work properly with v-for together vuejs/core#1166, https://composition-api.vuejs.org/api.html#template-refs
• Attributes coercion strategy changed - https://v3.vuejs.org/guide/migration/attribute-coercion.html#overview
  • data- 系
• Watch on Arrays - https://v3.vuejs.org/guide/migration/watch.html
• 0023-scoped-styles-changes - https://github.com/vuejs/rfcs/blob/master/active-rfcs/0023-scoped-styles-changes.md
  • ::v-deep usage as a combinator has been deprecated. Use ::v-deep() instead.
  • Targeting / Avoiding Slot Content
• ダイアログリファクタ
  • root.dialog
  • post form window
  • window
  • menu
  • tooltip
  • emoji picker
  • reaction picker
  • visibility picker
  • drive file select
  • notification setting window
  • url preview
  • signin
  • signup
  • form-window
  • toast
• remove destroyDom
• user-preview.ts
• v-autocomplete
• selectDriveFile
• selectDriveFolder
• mk-radio fix
• search.ts
• updateBanenr
• updateAvatar
• keyboard shortcuts
• バグ潰し
• Activated hook for directives vuejs/core#2349

vue-router

• New history option to replace mode - https://next.router.vuejs.org/guide/migration/#new-history-option-to-replace-mode
• Removed * (star or catch all) routes - https://next.router.vuejs.org/guide/migration/#removed-star-or-catch-all-routes
• All navigations are now always asynchronous - https://next.router.vuejs.org/guide/migration/#all-navigations-are-now-always-asynchronous
• scrollBehavior changes - https://next.router.vuejs.org/guide/migration/#scrollbehavior-changes

Thirdparty library status

• vue-i18n
• vue-fontawesome
  • Vue 3 props aren't reactive - Vue 3 props aren't reactive FortAwesome/vue-fontawesome#250
• vuedraggable - Vue 3 compatibility SortableJS/Vue.Draggable#881
  • ✔️ altnative - https://github.com/anish2690/vue-draggable-next
• portal-vue - Provide version that's Vue 3 compatible LinusBorg/portal-vue#300
• vue-prism-editor - Vue 3 upgrade koca/vue-prism-editor#90
• v-animate-css - https://github.com/jofftiquez/v-animate-css
• vue-json-pretty - https://github.com/leezng/vue-json-pretty
• vue-prism-component - Vue 3 Support egoist/vue-prism-component#26

---

Resolve #2945
Resolve #5834
Resolve #6387
Resolve #6392
Resolve #6133
Resolve #6090
Resolve #6579
Resolve #6560
Close #6666
Close #5831
Close #6425
Fix #6569

[YuzuRyo61]

頑張れ❤頑張れ❤

[SanMurakami]

無理しない程度に無理して

[EbiseLutica]

むぎゅっ

[atsukotominaga]

がんばえ〜💪