Vue.use(плагин), вызывающий ошибку: Vue является конструктором и должен вызываться с ключом `new`

Подключаемый модуль - https://www.npmjs.com/package/sweetalert

Код в main.js

import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap-vue/dist/bootstrap-vue.css';
import BootstrapVue from 'bootstrap-vue';

import Vue from 'vue';
import Vuetify from 'vuetify';
import swal from 'sweetalert';
import App from './App';
import router from './router';

Vue.use(BootstrapVue);
Vue.use(Vuetify);
Vue.use(swal);

Ошибка, полученная в браузере:

Uncaught SweetAlert: 1-й аргумент ('функция Vue (параметры) {
if ("development"! == 'production' &&
! (это экземпляр Vue)
) {
warn ('Vue является конструктором и должен вызываться с new
ключевое слово');
}
this._init (варианты);
}') является недействительным

1 ответ

Решение

Как уже упоминалось в комментариях, sweetalert модуль (с https://www.npmjs.com/package/sweetalert) не является плагином Vue, поэтому его нельзя использовать в...

Vue.use(swal)

Что вы можете сделать, это создать плагин. Например, это добавит swal() функция к Vue как глобальный метод (Vue.swal()) и метод экземпляра (this.$swal())

import Vue from 'vue'
import swal from 'sweetalert'

Vue.use({
  // this is the required "install" method for Vue plugins
  install (Vue) {
    Vue.swal = swal
    Vue.prototype.$swal = swal
  }
})

Я настоятельно рекомендую использовать существующий плагин Vue, например, vue-sweetalert2.

Другие вопросы по тегам