1. Install vuetify

npm install vuetify --save
Copy the code

2. Introduce related dependencies and initialization in main.js

import Vuetify from 'vuetify' import 'vuetify/dist/vuetify.min.css' Vue.use(Vuetify) new Vue({ vuetify: }).$mount('# Vuetify ').Copy the code

3. Install the icon

Method 1: Local installation

npm install @mdi/font -D
Copy the code

Then introduce the corresponding styles

import '@mdi/font/css/materialdesignicons.css'
Copy the code

Method 2: CDN introduction, due to network speed, sometimes may not be loaded out

Directly imported in the public/index.html file

< link href = "https://fonts.googleapis.com/css?family=Roboto:100, 300400500700900" rel = "stylesheet" > < link href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">Copy the code

4. Wrap components with V-app in app.vue

App. Vue file

<template>
  <v-app id="app">
    <router-view />
  </v-app>
</template>
Copy the code

The official link

Then you can use it happily!