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

Question

我正试图在我的vueJS应用程序中安装@casl/ability和@casl/vue，但似乎无法使其正常工作。我不知道我是做错了什么，还是与Quasar框架的集成可能会破坏一些东西。

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)

Answer 1

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

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