greenpress / vuex-composition-helpers

A util package to use Vuex with Composition API easily.
https://www.npmjs.com/package/vuex-composition-helpers
MIT License
290 stars 32 forks source link

Error when importing createNamespacedHelpers #41

Open samuveth opened 3 years ago

samuveth commented 3 years ago

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
davidmeirlevy commented 3 years ago

You should install "vuex-composition-helpers@next" with vue3. There are several differences that needed a major update for the package.

samuveth commented 3 years ago

@davidmeirlevy I did that, I'm on ^2.0.0

iercetin commented 2 years ago

Any updates?

davidmeirlevy commented 2 years ago

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

walfly commented 2 years ago

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?

v3nt commented 2 years ago

How was this resolved guys?