Upgrade project to Vue 3

[brylie]

Vue 3.0 was released in September 2020. However, this project is still using Vue 2.x.

Decide when it is time to upgrade this project to Vue 3.x

Description

One of the design constraints of Vue 3.x was to preserve backward compatibility with Vue 2.x projects. This would ideally mean very little would need to change when the Chooser project upgrades to Vue 3.x.

Alternatives

We can stay at 2. x, but that would mean decreasing support as 2.x reaches end-of-life.

Additional context

The upcoming Vue 3.1 release includes a "Migration Build" to help projects transition from 2.x to 3.x.

The Vue User Guide is defaulting to 3. x to signal that projects should be targeting the 3. x release.

:warning: Vue 3. x drops support for IE 11

[Cronus1007]

@brylie A suggestion from my side We can split this issue into several small bits and if new contributors would like to contribute to the system then we can assign those issue to separate individuals. Until then I am willing to work upon it.

[SaySayo]

Hello I'm an outreachy applicant. I would like to work on a part of this issue when it's split into smaller bits.

[brylie]

To be honest, I'm not really sure what smaller bits to divide this into. In effect, we need to upgrade the project to Vue 3 in a single pass, ensuring all of the components still work.

[brylie]

@Cronus1007 and @SaySayo, would you like to work together on this task?

[Cronus1007]

Sure.

[brylie]

Thanks. The first place to start is to try and resolve our package updates by running npm audit. Unfortunately, we have several updates that are blocked currently. Could you help us update our main project packages before the Vue 3 migration?

[Cronus1007]

Unfortunately, we have several updates that are blocked currently.

@brylie There are about 113 vulnerabilities in the repository currently where 40 are moderate ones, 71 are high and 2 are critical. Also, elaborate on which updates are blocked currently.

[brylie]

@Cronus1007, if you run npm audit --fix you can see a full report of the remaining package updates that cannot be automatically fixed without the --force flag. Adding --force results in a broken build process. From the best I can tell, there are some constraints around node-sass or sass that cannot be resolved without --force.

[Datagirlcmr]

can you assign this to me?. I plan on debugging and researching several ways to clear out most of the vulnerabilities

[brylie]

Thanks, @Datagirlcmr :smiley: I've assigned you.

We may be able to remove some of the dependencies here, to slim down our project profile and make maintenance easier.

[brylie]

I'm removing this from the current milestone, due to the complexity of this task and the urgency of other development issues, such as the dependency vulnerabilities #989

[Datagirlcmr]

Okay, @brylie . Each time I fixed a dependency issue, others became more visible and npm run serve threw a lot of other errors. Any pointers on what I should be doing about that now?

[brylie]

Let's put this issue on hold for now since there seem to be irreconcilable dependency issues. We may need to wait for changes in Storybook to resolve the dependency upgrades and then proceed with the Vue 3 upgrade.

On a general note, I am not sure that we need the Vue components since they aren't in use in any of the Creative Commons projects.

[sadn1ck]

On a general note, I am not sure that we need the Vue components since they aren't in use in any of the Creative Commons projects.

I think chooser-beta uses those? (eg: here)