使用 casl & vue 时的警告和错误

如何解决使用 casl & vue 时的警告和错误

我正在尝试在我的 vueJS 应用程序中安装 @casl/ability 和 @casl/vue，但似乎无法使其工作。我不知道我是否做错了什么，或者与 Quasar Framework 的集成是否会破坏某些东西。

casl.js（在 quasarconf 中调用）

import Vue  from 'vue';
import { abilitiesPlugin } from '@casl/vue';
import ability from '../services/ability';

Vue.use(abilitiesPlugin,ability)

./服务/能力

import { AbilityBuilder,Ability } from '@casl/ability'

export default function defineAbilityFor(user) {
  const { can,cannot,build } = new AbilityBuilder(Ability);

  can('readOwnData','all')
  can('readManagerData','all')
  can('readsquadData','all')

  return build();
}

我收到了这些警告

 WARNING  Compiled with 4 warnings                                   10:50:50 AM

 warning  in ../node_modules/@casl/vue/dist/es5m/index.js

"export 'defineComponent' (imported as 't') was not found in 'vue'

 warning  in ../node_modules/@casl/vue/dist/es5m/index.js

"export 'inject' (imported as 'n') was not found in 'vue'

 warning  in ../node_modules/@casl/vue/dist/es5m/index.js

"export 'provide' (imported as 'r') was not found in 'vue'

 warning  in ../node_modules/@casl/vue/dist/es5m/index.js

"export 'ref' (imported as 'i') was not found in 'vue'

控制台中的这个错误

index.js?0c5a:1 Uncaught TypeError: Object(...) is not a function
    at eval (index.js?0c5a:1)
    at Module.../node_modules/@casl/vue/dist/es5m/index.js (vendor.js:23)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)
    at eval (casl.js?8d6e:1)
    at Module../src/boot/casl.js (app.js:1137)
    at __webpack_require__ (app.js:854)
    at fn (app.js:151)
    at eval (client-entry.js:24)
    at Module../.quasar/client-entry.js (app.js:1019)