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

Question

我正试图在我的vueJS应用程序中安装@casl/异能和@casl/vue，但似乎无法使它工作。我不知道我是否做错了什么，或者与类星体框架的集成可能会破坏什么。

casl.js (在准碳管中被调用)

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)

Answer 1

我建议你在下面安装这个版本，它解决了这个问题。我想vue的当前版本有问题

"@casl/ability": "^3.3.0",
"@casl/vue": "^0.5.1",