Nuxt 3 is now stable. Vuetify 3 is now stable. I will be updating this template as we go along. Feel free to open an issue if you have any questions or suggestions.
This template here will get you up & running with adding the two together :)
As time passes, I will be updating this template. It will grow with some more pages. It all started with the login & register pages. I may keep a running list of pages added here.
Click to see the pages added & planned
- Login
- Register
- Reset Password
- Install the deps
npm install- Run the app
npm run dev- NuxtJS
- Nuxt Icon
- Sass
- Vuetify
- @vite-pwa/nuxt
- Vite Plugin Vuetify
The .scss file that can be found in the assets folder have some gradients & other styles. They can be deleted or updated.
The helper utils folder contains the custom stuff for the Vuetify plugin
So I switched from the nuxt-icon module to the @iconify/vue component here. It plays better with Vuetify with custom icons
Here is a link to the docs for this Creating a custom iconset
This file here just set global props on different vuetify components. You can learn more here Global Configuration
This file will hold all the different themes that you want to use in your app. Feel free to add more crazy schemes lol. Learn more here: Vuetify Themes
I added one composable for form rules. Add more here. You can even try integrating other validation packages like yup or zod
I will definitely be switching to vee-validate for dealing with forms.
The public folder contains a favicon & icon. Change these out for your app and be sure to tweak the pwa config inside the nuxt.config file to fit your app