_plugins_vuetify__WEBPACK_IMPORTED_MODULE_136 __。default不是构造函数

Question

我已经用vue cli 3构建了一个vue应用并添加了vuetify。 现在，为了减小包的大小，我将vuetify导入更改为：

我正在使用vuetify 1.5.5和vue 3.7.0

import Vue from 'vue';
import Vuetify, { VLayout, VBtn, VApp } from 'vuetify/lib';
import 'vuetify/src/stylus/app.styl';

Vue.use(Vuetify, {
  components: {
    VApp,
    VLayout,
    VBtn,
  },
  theme: {
    primary: '#ee44aa',
    secondary: '#424242',
    accent: '#82B1FF',
    error: '#FF5252',
    info: '#2196F3',
    success: '#4CAF50',
    warning: '#FFC107',
  },
  options: {
    customProperties: true,
  },
  iconfont: 'md',
});

export default Vuetify;

但是在此之后，我在控制台中收到此错误：

Answer 1

摘要：您不应编写导出默认Vuetify； vuetify.js只是应该在main.js中导入的js文件

// plugins/vuetify.js


import Vue from 'vue'
import Vuetify from 'vuetify/lib'
import 'vuetify/src/stylus/app.styl'
import colors from 'vuetify/es5/util/colors'

Vue.use(Vuetify, {
iconfont: 'md',
  theme: {

primary: colors.green.base, // #4CAF50

secondary: colors.red.lighten4, // #FFCDD2

accent: colors.indigo.base, // #3F51B5

search: colors.grey.lighten2, // #E0E0E0

searchButton: colors.green.lighten3,  // #A5D6A7

newsBlock: colors.grey.lighten4, // #F5F5F5

// info: colors.lighten1,

// warning: colors.darken2,

// error: colors.accent4,

// success: colors.lighten2,

  }
})


// main.js

import Vue from 'vue'
import './plugins/vuetify'
...
new Vue({
  el: "#app",
  router,
  store,
  render: h => h(App),
})