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

Question

涉及插件 - 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);
}'） 是无效的

Answer 1

如评论中所述， sweetalert模块（来自https://www.npmjs.com/package/sweetalert ）不是Vue 插件，因此您不能在...

Vue.use(swal)

您可以做的是创建一个插件。 例如，这会将swal()函数作为全局方法 ( Vue.swal() ) 和实例方法 ( this.$swal() ) 添加到Vue

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 。