Migration/vuejs3

[J9rem]

trafficstars

Je crée cette PR draft pour recueillir les discussions autour de la migration vers vuejs3.

J'ai commencé quelques bricoles mais il y a encore plein de choses qui ne fonctionnement pas comme

• VueSelect dans actions-builder
• des soucis de DOM avec des </div> en trop (avant ça ne râlait pas)
• vérifier que tous les appels de new Vue( sont bien remplacés par app = createApp
• vérifier le fonctionnement de this.$slots en remplacement de this.$scopedSlots
• faire attention à ce que this.$el.parentNode.dataset fonctionne bien en remplacement de this.$el.dataset
• etc etc etc

[seballot]

Yo !

Je viens de voir cette PR ! Il y a une raison particulière pour laquelle tu as voulu migrer vers Vue 3? j'ai rien contre, c'est juste que ça va probablement demander pas mal de taf (comme tu as déjà du te rendre compte :)) pour assez peu de gain IMHO

Juste pour info, j'ai vite fait matté les changements de code, pour nextTick, plutot que de sauvegarder la valeur de this dans une variable tu peux utiliser une arrow function

nextTick(() => {
  this.myData
})
// plutot que faire
const myApp = this
nextTick(function() {
  myApp.myData
})

Et pour les watchers, le deep: true était déjà présent sur Vue2, donc à ma connaissance il n'y a pas besoin de le rajouter dans la migration vers Vue3 (sauf cas exceptionels peut etre). Car la syntaxe est vachement plus lourde, avec la fonction handler en plus

happy coding !

[J9rem]

merci @seballot d'avoir jeté un coup d'oeil ici

Il y a une raison particulière pour laquelle tu as voulu migrer vers Vue 3

cette PR draft fait suite à des échanges avec @mrflos . Elle sert surtout à partager les bouts de code tester et les discussions pour éventuellement passer à VueJS 3.

La question du départ de @mrflos était : pourquoi restons-nous en vuejs2 alors que de nouvelles librairies sympa JS sortent en utilisant VueJs 3 ? Nous risquons de ne pas pouvoir les utiliser en faisant tourner un VueJS2 sur YesWiki... en plus, il y a aura bien un jour un arrêt de la maintenance de VueJS 2. Autant s'y préparer.

L'intention de la présente PR et du code associé n'est pas de faire une migration à VueJS 3 mais plutôt de faire une tentative de migration en identifiant ce qui bloque et donc les points à travailler pour passer à VueJs 3. A priori c'est principalement vue-leaflet et vue-select qui sont compliquée à migrer.

Je me suis arrêté sur ce point et je pense que la branche reprendra vie le jour où il nous faudra migrer à VueJS 3 pour raison d'incompatibilité ou de faille de sécurité dans VueJS 2 non maintenue

deep: true

c'est un breaking-change pour VueJS 3. en VueJs 2 l'option a pour valeur par défaut true alors qu'en VueJs 3, la valeur par défaut est false et dans certains cas nous en avons besoin.

Pour le reste, je n'ai pas optimisé l'écriture du code. Effectivement, tes remarques sont pertinentes

[mrflos]

Pour info, vue-leaflet a une lib compatible vuejs3 https://github.com/vue-leaflet/vue-leaflet et vue-select une procédure de migration https://vue-select.org/guide/upgrading.html#index-prop-replaced-with-reduce

Pour ma part aussi je suis partisant de ne pas migrer trop tot vers une version majeure, mais de s'y préparer et de le faire pas trop tard car en laissant e jachère, on se retrouve avec une dette plus difficile à résoudre dans le code, comme l'illustre par exemple le fait d'avoir bootstrap 3 et jquery encore dans le code de yeswiki!

[J9rem]

@mrflos effectivement @vue-leaflet/vue-leaflet est compatible mais ça n'est pas la librairie que nous utilisons. Nous utilisons vue2-leaflet (voir fichier package.json)

Il se trouve que notre code fait pour vue2-leaflet n'est pas compatible de @vue-leaflet/vue-leaflet. J'ai commencé à introduire @vue-leaflet/vue-leaflet en remplacement de vue2-leaflet mais ça ne semble pas fonctionner du premier coup.