Open nucleogenesis opened 2 years ago
Unfortunately, upgrading to Vue 2.7 will not help us. The v-bind
syntax uses CSS variables. From the documentation:
The actual value will be compiled into a hashed CSS custom property, so the CSS is still static. The custom property will be applied to the component's root element via inline styles and reactively updated if the source value changes.
'custom property' is another name for CSS variables.
The other issue here is the tangled interdependencies between Kolibri, KDS, and Studio. I would recommend as a precursor to this we should address at least part of https://github.com/learningequality/kolibri/issues/8454 - specifically, separating out our linting tools in a way that non-Kolibri plugin repos (like KDS and Studio) can use them with fewer restrictions.
Vue 2.7 is in Beta right now and it brings along a substantial portion of the new Composition API, among other potential benefits to our front-end development in Kolibri.
Acceptance Criteria
Generally speaking, this should be about a 30 minute project to do some research / planning for an imminent upgrade when Vue 2.7 is out of Beta. There is no expectation that this will result in a working upgraded build, but more that when we go to do it we have some of the grunt work done and can hopefully make the change with ease:
@vue/composition-api
package and it's definition in our apiSpecv-bind
in CSS to see if it can serve to makeaphrodite
obsolete and simplify how we make styles conditional and map them to JS values