search

Systems-Development-and-Frameworks / Felni

0 stars 0 forks source link

understanding NUXT and VueJS/HTML casing #14

Open JaielZeus opened 3 years ago

JaielZeus commented 3 years ago

https://github.com/Systems-Development-and-Frameworks/Felni/blob/76a7c0e0b5e66bd1f25e4e0015a7e37cda781cb1/webapp/pages/login.vue#L8

HEy hab nur mal so nebenbei mal euer repo angeschaut. Ich habe gesehen das ihr die Komponenten immer noch manuell importiert und registriert. Das braucht ihr nicht. Nuxt erledigt das für euch, einfach eine Komponente im Template benutzen und Nuxt kümmert sich darum dass es richtig registrietriert und importiert wird. Außerdem die Komponentennamen: Da würde ich einfach aus Konsistenz her mit dem HTML standard der eh alles in Kleinbuchstaben verarbeitet halt mit kleinbuschstaben arbeiten und kebab case benutzen.

Sprich eure LoginForm.vue braucht ihr 1. nicht importieren, 2. nicht registrieren als Komponente von login.vue 3. nciht als \<LoginForm /> zu schreiben der konsistenz wegen.

Das heißt einfach im Template <login-form /> einfügen und den import und die component registration weglassen. In html is klein und kebab case der standard und auch bei vueJS werden Komponenten namen in kebab case und klein umgewandelt. Da gibt es auch einen catch wenn man in-browser vueJS benutzt dass man darauf achtet eine komponente IchBinEineVueKomponente dann im template als \<ich-bin-eine-vue-komponente /> einzufügen, bei preprocessorn die halt eure vue single file template dann umwandeln zur Produktion gibt es solche probleme ja nicht aber nur als Tipp und finde sieht besser aus statt \<IchBinEineVueKomponente />

VueJS website empfiehlt PascalCase in SingleFile components so wie bei uns aber ich würde immer kebab case empfehlen damit man daran gewöhnt ist und wenn man pure dom vueJS apps schreibt keine langen debug stunden verbringt warum etwas nciht richtig gerendert wird, aber nur eine kleine sache. PascalCase ist auch cool

https://vuejs.org/v2/style-guide/#Multi-word-component-names-essential https://vuejs.org/v2/style-guide/#Component-name-casing-in-templates-strongly-recommended

NicolasTsc commented 3 years ago

Danke für deine Hinweise, wir werden uns das dann mal anschauen :)