Vue.use(plugin) 导致错误：Vue 是一个构造函数，应该使用 `new` 关键字调用答案

【问题标题】：Vue.use(plugin) causing error: Vue is a constructor and should be called with the `new` keyworVue.use(plugin) 导致错误：Vue 是一个构造函数，应该使用 `new` 关键字调用
【发布时间】：2018-08-14 02:26:50
【问题描述】：

涉及插件 - 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);

浏览器收到错误：

未捕获的 SweetAlert：第一个参数 ('function Vue (options) {
if ("开发" !== '生产' &&
!（这个 Vue 实例）
) {
warn('Vue 是一个构造函数，应该使用 new
调用关键字');
}
this._init(options);
}') 无效

【问题讨论】：

为什么不尝试使用这个包github.com/anteriovieira/vue-swal#readme
移到这个插件是因为我在 vue-swal 处理无法使用声明文件时遇到了一个不同的错误，并且它隐含地具有“任何”类型。所以是的......
我怀疑你可以简单地 Vue.use() swal 模块，因为它不符合 Vue 的 plugin requirements。究竟你想做什么？
除非我遗漏了什么，否则这正是文档中所说的设置方式。我正在尝试使用它在 http 帖子之后显示消息，但我并没有走得那么远。错误发生在Vue.use()。
哇——这到底怎么不符合 Vue 的插件要求，@Phil？这种加载插件的方法显示在您提供的链接中。

标签： javascript vuejs2 sweetalert2

【解决方案1】：

如 cmets 中所述，sweetalert 模块（来自 https://www.npmjs.com/package/sweetalert）不是 Vue plugin，因此您不能在...中使用它

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。

【讨论】：