vuetify/lib 中的警告导出 'default'（导入为 'Vue'）在 'vue' 中找不到

Question

我在 vue-laravel 项目中安装了 Vuetify。我没有使用 vue cli。我安装的节点模块是：

vuetify
vuetify-loader
sass-loader

我遵循了这个教程：Setup Laravel with Vue and Vuetify
我的 webpack.mix.js:

里有这个

const VuetifyLoaderPlugin = require('vuetify-loader/lib/plugin')
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin')
var webpackConfig = {
    plugins: [
        new VuetifyLoaderPlugin(),
        new CaseSensitivePathsPlugin()
    ]
}

在我的插件文件夹中，我有一个文件 vuetify.js，其中包含：

import Vue from 'vue'
import Vuetify from 'vuetify/lib'

Vue.use(Vuetify)

export default new Vuetify({
    icons: {
      iconfont: 'md',  // 'mdi' || 'mdiSvg' || 'md' || 'fa' || 'fa4'
    },
    theme: {
      dark: false,
    },
    themes: {
      light: {
        primary: "#4682b4",
        secondary: "#b0bec5",
        accent: "#8c9eff",
        error: "#b71c1c",
      },
    },
  })

在我的 app.js 这个：

require('./bootstrap');
require('alpinejs');
require('livewire-vue');

import 'material-design-icons-iconfont/dist/material-design-icons.css';
import { plugin } from 'postcss';
import 'livewire-vue'
import Vue from 'vue'
import Vuetify from "../plugins/vuetify"
Vue.use(Vuetify);

这是与 laravel blade 视图链接的 vue 文件的一部分

new Vue({
    el: '#facility',
    vuetify: Vuetify,
    data: () => ({
        url: dir,
        search: '',
}),

我的问题是当我输入 npm 运行 dev 它 returns 55 个这样的警告： ./node_modules/vuetify/lib/util/mixins.js 中的警告 4:9-19 在 'vue' 中找不到导出 'default'（导入为 'Vue'）。我可以在控制台中阅读的内容来自 vuetify/lib，在 blade 视图中，一些组件像网格系统一样工作良好，而其他组件则根本无法工作，如 v-rating。主要颜色、错误颜色或警告颜色不起作用。

版本：

"@mapbox/mapbox-sdk": "^0.13.3",
"case-sensitive-paths-webpack-plugin": "^2.4.0",
"chart.js": "^3.5.1",
"mapbox-gl": "^0.53.1",
"mapbox-gl-vue": "^2.0.4",
"vform": "^2.1.0",
"vue": "^3.2.31",
"vue-axios": "^3.2.4",
"vue-mapbox": "^0.4.1",
"vue-router": "^3.5.1",
"vue-template-compiler": "^2.6.14",
"vuetify": "^2.6.5",
"vuetify-loader": "^1.7.3",
"vuex": "^3.6.2"
Laravel 8

Answer 1

根据您的代码共享，您安装了 Vue 3

"vue": "^3.2.31",

目前 Vuetify 不支持 Vue 3。

检查以下link。

https://vuetifyjs.com/en/introduction/roadmap/

vuetify/lib 中的警告导出 'default'（导入为 'Vue'）在 'vue' 中找不到

WARNING in vuetify/lib export 'default' (imported as 'Vue') was not found in 'vue'

laravel

vue.js

vuetify.js

版本：