[Feature Request] Vuejs 3 support

[oligot]

Problem to solve

Hi all,

Now that Vuejs 3 beta has been released, I'm trying to use it with Vuetify but it doesn't work.

Here are the steps to reproduce it:

vue create my-app
cd my-app
vue add vuetify
vue add vue-next
npm run serve

The last command gives the following error

> [email protected] serve /tmp/my-app
> vue-cli-service serve

 INFO  Starting development server...
 ERROR  Error: [VuetifyLoaderPlugin Error] No matching rule for vue-loader found.
Make sure there is at least one root-level rule that uses vue-loader.
Error: [VuetifyLoaderPlugin Error] No matching rule for vue-loader found.
Make sure there is at least one root-level rule that uses vue-loader.
    at VuetifyLoaderPlugin.apply (/tmp/my-app/node_modules/vuetify-loader/lib/plugin.js:29:13)
    at webpack (/tmp/my-app/node_modules/webpack/lib/webpack.js:51:13)
    at serve (/tmp/my-app/node_modules/@vue/cli-service/lib/commands/serve.js:162:22)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] serve: `vue-cli-service serve`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] serve script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

Proposed solution

I assume this is related to breaking changes in vue(-loader), which breaks vuetify-loader...

[KaelWD]

We're working on it already:

https://vuetifyjs.com/introduction/roadmap/

https://discord.gg/ex3BvcY

[oligot]

Ok, thanks for the answer.

[bychung]

Any updated on this issue? Wanna use Vuetify on Vue 3....

[DRoet]

Maybe this should remain open until vuetify 3 is released so people can track the issue here?

[jacekkarczmarczyk]

Might be pinned as well

edit: probably would be better to create a new issue by ourselves which describes the schedule etc

[JenuelDev]

Any update on this issue? Wanna use Vuetify on Vue 3 for my new project.

[DRoet]

Current estimate is Q1 2021

[bmarwell]

Oh :( The roadmap said Q3/Q4 2020 (and still does): https://vuetifyjs.com/en/introduction/roadmap/

[MajesticPotatoe]

This has already been updated on docs-next https://next.vuetifyjs.com/en/introduction/roadmap/#in-development
note: Q4 2020 is estimate for alpha/beta, full release will very likely not be till Q1 2021

[bmarwell]

Q4 2020 is estimate for alpha/beta, full release will very likely not be till Q1 2021

Next oh :( because the roadamaps both only say "release". This is the first time I saw the "alpha/beta" qualifier for this date. If I had known this earlier, I would not have started a Vue 3 project.

[bmarwell]

Vuetify is on the death road if it is not available in a few weeks, to wait for 3-4 months is a non-sense... Sorry guys!

That’s really not a nice comment. You should be thankful there is such a great framework!

To clarify: My comment was only a "too bad" that the roadmap hadn’t had more details. Other than that, I am looking forward to it! 👍🏻

[sbillet]

As far as I understand, the work starts just now and the plan is to rewrite Vuetify from scratch using the Composition API.
Is that really necessary? A smaller scope would increase my confidence that Vuetify can really be used with Vue 3 around Q1/2020 ;)

[jmunozco]

Sorry, I know it is a good framework, it's not a request, it's just an opinion... I know the hard work you guys do, but what I mean is 3-4 months is too much time for a scheduled Vue3 release adoption. Apart from that, to clarify too: I like Vuetify, it's a great project.

[jacekkarczmarczyk]

@sbillet it's not about composition api, we're using render functions and this is the part that has changed completely and forces us to rewrite things. So yes, it is necessary

[robrich]

What're some Material Design frameworks for Vue 3 I can use in the mean time?

[jacekkarczmarczyk]

I doubt there are any, few days ago Evan mentioned only 2 frameworks that are Vue 3 ready, none of them seem to implement Material Design
https://youtu.be/Vp5ANvd88x0?t=2688

[johnleider]

Vuetify is on the death road if it is not available in a few weeks, to wait for 3-4 months is a non-sense... Sorry guys!

This comment is nonsense. To suggest that Vuetify should be ready with a few weeks of the Vue 3 launch is unreasonable. We have arguably the largest codebase of any Vue framework and that process is going to take time.

The entire Vue ecosystem is not going to immediately switch to Vue 3, it's going to take time. We have thousands of projects that still operate on v1.5 of Vuetify and are just now converting to v2.0.

As far as I understand, the work starts just now and the plan is to rewrite Vuetify from scratch using the Composition API.

We are not starting from complete scratch. We have active work done on the next branch of this repository with the core services already functioning in a Vue 3 setting. We have a complete outline of our v3 development from coding guidelines for composables and mapped out a task list for completion. All of this is available on our Public v3 Notion Board—including information regarding our meetings, breaking changes, RFC's, and more.

Is that really necessary? A smaller scope would increase my confidence that Vuetify can really be used with Vue 3 around Q1/2020 ;)

The baseline of Vuetify is for all intents and purposes, simple. Since we already build compositionally, a lot of what we do will be a simple port. As well, we will have nightly and/or canary releases in addition to alphas and betas. The composable style of development introduced in Vue 3 is already in line with how Vuetify is developed. This means a lot of functionality will port over easily.

However, there are several components, namely v-calendar, v-time-picker, and v-data-table, that are very complex and large in scope. They will take longer and as such are slated for later phases.

That’s a shame. Vuetify definitely needs a business model. I want to support it but I have 3 different patreons to choose from and GitHub sponsors, that’s a mess. My company will also be willing to pay for it in exchange of a license key or something.

Vuetify does have a business model—we have a store, business support options, enterprise support options, consulting, and more. The tiers/rewards on Patreon, GitHub, and Open Collective are all the same with the exception of a few perks on Open Collective.

There is no license key, Vuetify is MIT, so I have no response for that.

---

I understand the frustration Vuetify 3's timeline, but it's circumstantially out of my control. The pandemic slowed down v3 development to a point where I knew we wouldn't be able to hit the goal of being ready for v3. Because of this, I made the decision to pause Vuetify 3 development to focus on fixing the unmaintainable architecture of the current production documentation. Since we are going to be behind anyways, we took the opportunity to improve the structure, prepare for updates pertaining to Vuetify 3, and make it easier to contribute to.

I can appreciate the passion of wanting us to have something fast, but we want to have something good. Being late may hurt our Vue 3 adoption, but it's most certainly not the death of the framework. (I'd argue the contrary, it's going to be the death of other frameworks ⚰). Vuetify 3 is a culmination years of learned lessons and will be the team's opus magnum.

[mrts]

@johnleider, thank you for a considerate response and thorough explanation! As far as I understand, Vue 3 is supposed to be mostly backwards-compatible and a "migration build" is in the works with Vue 2 compatible behavior (and runtime warnings of incompatible usage). So perhaps an interim step would be to implement minimal changes in the current codebase and vuetify-loader to make Vuetify run within the migration build (even if this is not fully optimal), before publishing the full composition-API rewrite?

[MatthewAry]

Perhaps this issue should be locked.