How to use Vuetify in nuxt

Hello, I'm Korean Student. please understand my short English :)

I want to start toy-project by vue + nuxt

but I cannot find enough data.

I want to use Vuetify but I don't no how can i set.

I saw Vuetify official site but i don't understand by guide.

please help me direct or example project link.

thanks

oes

9 years ago

Best Answer

Level 3

1, Create plugin called vuetify.js in plugins and add this code.

import Vue from 'vue'
import Vuetify from 'vuetify'

Vue.use(Vuetify)

2, In nuxt.config.js add the following.

    plugins: ['~plugins/vuetify.js'],

    css: [
        {
            src: join(__dirname, 'assets/css/app.styl'),
            lang: 'styl'
        }
    ],

    build: {
        vendor: ['vuetify'],
    }

3, In assets folder create css folder and file called app.styl add this content

$theme := {
  primary: #9c27b0
  accent: #ce93d8
  secondary: #424242
  info: #0D47A1
  warning: #ffb300
  error: #B71C1C
  success: #2E7D32
}
@require '~vuetify/src/stylus/main.styl'

2 likes

takeU

9 years ago

Level 1

thanks a lot :)

Please or to participate in this conversation.