美文网首页
Vuetify 设置主题

Vuetify 设置主题

作者: 草帽lufei | 来源:发表于2019-10-12 19:31 被阅读0次

main.js 中添加 theme注意 new Vue({}) 中的 vuetify

import '@mdi/font/css/materialdesignicons.css'
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import './registerServiceWorker'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
import axios from 'axios'
import VueAxios from 'vue-axios'
import './mock.js'

Vue.use(Vuetify, {
  icons: {
    iconfont: 'mdi'
  }
})

Vue.use(VueAxios, axios)

Vue.config.productionTip = false
const opts = {
  theme: {
    themes: {
      light: {
        primary: '#03a9f4',
        secondary: '#009688',
        accent: '#9c27b0',
        error: '#f44336',
        warning: '#ff5722',
        info: '#607d8b',
        success: '#4caf50'
      }
    }
  }
}

new Vue({
  router,
  store,
  vuetify: new Vuetify(opts),
  render: h => h(App)
}).$mount('#app')

这个仓库里面有主题设置的具体实现: https://github.com/gywgithub/vue-d3-examples

相关文章

网友评论

      本文标题:Vuetify 设置主题

      本文链接:https://www.haomeiwen.com/subject/gvdcmctx.html