VUE项目导入 Vuetify

最新推荐文章于 2024-04-30 16:43:39 发布

北山_

最新推荐文章于 2024-04-30 16:43:39 发布

阅读量1.5k

点赞数 2

分类专栏： vue Java 文章标签： vue vuetify

本文链接：https://blog.csdn.net/qq_32196629/article/details/114673667

版权

10 篇文章 0 订阅

订阅专栏

5 篇文章 0 订阅

订阅专栏

1、创建Vue项目（webpack或 WebStorm）工具直接创建Vue项目即可。cmd进入项目路径下：

npm install vuetify --save

2、进入项目，在 src 目录下创建 plugins 目录，并在 plugins 目录下创建 vuetify.js 文件，其中的代码为：

import Vue from 'vue'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
Vue.use(Vuetify)
export default new Vuetify()

3、在 main.js 文件中引入代码：

import Vuetify from 'vuetify'
import vuetify from '@/plugins/vuetify'

Vue.use(Vuetify)

4、使用过程中，可能 vueyify 的图标、图片都不显示，需要引入图标样式，项目路径下 cmd 运行：

npm install material-design-icons-iconfont -D

进入 mian.js 文件中添加引入代码：

import '@mdi/font/css/materialdesignicons.css'

关注