vuex-composition-helpers
vuex-composition-helpers copied to clipboard
Error when importing createNamespacedHelpers
I'm trying to use this package with my vue-3 app and the composition api, but I'm running into this error. Any ideas?
Version: "vuex-composition-helpers": "^2.0.0",
import { createNamespacedHelpers } from 'vuex-composition-helpers';
const { useState } = createNamespacedHelpers('favoriteSpaces');
export default {
setup() {
const { favorites } = useState(['favorites']);
}
}
error in ./node_modules/vuex-composition-helpers/dist/util.js
Module parse failed: Unexpected token (52:20)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| throw new Error('You must use this function within the "setup()" method, or insert the store as first argument.');
| }
> return vm.proxy?.$store;
| }
| //# sourceMappingURL=util.js.map
@ ./node_modules/vuex-composition-helpers/dist/global.js 2:0-98 10:16-36 12:11-21 18:16-36 20:11-21 20:40-54 26:16-36 28:11-21 28:40-51 34:16-36 36:11-21 36:40-49
@ ./node_modules/vuex-composition-helpers/dist/index.js
@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist??ref--0-1!./src/views/Timeline.vue?vue&type=script&lang=js
@ ./src/views/Timeline.vue?vue&type=script&lang=js
@ ./src/views/Timeline.vue
@ ./src/router.ts
@ ./src/main.ts
@ multi (webpack)-dev-server/client?http://192.168.10.102:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.ts
You should install "vuex-composition-helpers@next" with vue3. There are several differences that needed a major update for the package.
@davidmeirlevy I did that, I'm on ^2.0.0
Any updates?
It seems like your code is failing due to the usage of optional chaining.
as you can see, your error is:
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
and it's regarding the line: return vm.proxy?.$store;
you probably need node 14+, and to accept optional chaining.
As mentioned on babl, it's already included in the latest version of @babel/preset-env when using ES2020:
https://babeljs.io/docs/en/babel-plugin-proposal-optional-chaining
Its common practice for people to exclude node_modules from being processed by babel because running all your dependencies through a transpiler makes your builds much longer. Could you update your compile target to not include features like this?
How was this resolved guys?