vuetify example icons not showing

vuetify 예제를 보면서 웹페이지를 만들고 있는데, 예제에 있는 버튼들이 보이지 않았다.

 

알고보니 Vuetify의 예제들은 일반 버튼을 쓰는게 아니라 material design의 버튼을 쓰는 것이었다.

1. npm 으로 material-design-icons-iconfont 를 설치해준다.

# npm install material-design-icons-iconfont

 

2. // src/plugins/vuetify.js 에 아래와 같이 변경해준다.

// src/plugins/vuetify.js 

// Ensure you are using css-loader 
import 'material-design-icons-iconfont/dist/material-design-icons.css' 
import Vue from 'vue' 
import Vuetify from 'vuetify/lib' 

Vue.use(Vuetify) 

export default new Vuetify
({ 
	icons: { 
		iconfont: 'md', 
	}, 
})

출처 : https://vuetifyjs.com/en/customization/icons#install-material-icons