ktsn / sinai Goto Github PK

Set up as below code

import * as Sinai from 'sinai'
import aside from './aside'
import Vue from 'vue'

Vue.use(Sinai)

const root = Sinai.module().child('aside', aside())

export const store =  Sinai.store(root, {
  strict: process.env.DEV,
})


class Fake {
  get store() {
    return store
  }
}

declare module 'vue/types/vue' {
  interface Vue {
    $store: typeof Fake.prototype.store
  }
}

export default () => (store)

Now you can use this.$store like below

  import {Component, Vue} from 'vue-property-decorator'
  import store from 'src/store'

  @Component
  export default class IndexPage extends Vue {

    meta: {

    }

    mounted() {
      console.log(store().state.aside.version)
    }
  }

function flattenGetters(getters, sep) {
    function loop(acc, path, getters) {
        Object.keys(getters).forEach(function (key) {
            if (key === '__proxy__' || key === 'modules') {
                return;
            }
            if (!(getters[key].__proto__ instanceof BG)) {
                Object.defineProperty(acc, path.concat(key).join(sep), {
                    get: function () { return getters[key]; },
                    enumerable: true,
                    configurable: true
                });
            }
            else {
                loop(acc, path.concat(key), getters[key]);
            }
        });
        return acc;
    }
    return loop({}, [], getters);
}

when the getters[key] return null,undefined
it throw error Cannot read property '__proto__' of undefined;

@ktsn How sinai register module dynamically
https://vuex.vuejs.org/guide/modules.html#dynamic-module-registration

Thanks for the great library. Do we have any plan and progress supporting Vue 3.x?

Mutations are not recognized in the dev tools if the mutation method is located in a parent class and called on a sub class.

This is my current implementation:

abstract class AbstractMutations extends Mutations {
  myMutation() { ... }
}

And this is the mutations class that the mutation gets called on:

class ConcreteMutations extends AbstractMutations { }

The app is working as expected, it's just not debuggable like that.

Actually, the subscribed functions are handle like (path, args, state), but vuex handle them like (path, state)
In order to make vuex plugins compatible, shouldn't this be (path, state, args) ?

maybe we can use like a function composition

Hi, here is the code copied from README. I have an issue that it says counter does not exist on getters, actions or mutations. Only state works though. The code added on a fresh vue2 app: sinai 0.2.6, typescript 3.9.3

If remove root then use const store = createStore(counter) then it works correctly, but afterward there's no point of combined root for complex use case.

Hello there!

I've recently started using your library since I really love the type safety it brings. However I've hit a major roadblock. I have two modules (user session & current document="adventure" being edited) which some other modules depend on.

However, I cannot simply import my store in these modules without triggering a TypeScript compiler error due to it being a cyclic dependency: 'store' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.ts(7022)

index.ts:

[...snip...]

Room.ts:
[...snip...]

[...snip...]

If I remove the store import in the first line of the Room.ts screenshot everything compiles just fine.

I've tried some hacks such as accessing the private member store of the __proxy__ variable, but it always leads to the same error.

How would one introduce depenencies on other moduels with this library?

Thanks for your time!

Actions should not return other than Promise is reported even when action returns Promise,
And the values actually returned are always undefined.

I get the following error:

Subsequent variable declarations must have the same type. Variable 'store' must be of type 'VueStore<any, any, any, any> | undefined', but here has type 'Store | undefined'.

It seems that the sinai VueStore Interface is conflicting with the vue Store interface

I am using nuxtjs. This might play a role.

Hi,

When I try to reproduce the code on the README, I get Property 'counter' does not exist on type '{}' error when doing store.state.counter.count

The store declaration is

// Create root module
const root = module().child('counter', counter)

// Create store
const rootStore = store(root, {
  strict: process.env.NODE_ENV !== 'production'
})

But if I pass the counter module instead, it works as expected when doing store.state.count :

// Create store
const rootStore = store(counter, { // <--
  strict: process.env.NODE_ENV !== 'production'
})

and I couldn't figure out how to make "module()" work. Is there something I'm missing? What I want is to partition my store in several modules.

I created a new project using version 3.0.0-beta.12 of the vue cli with Babel, TypeScript and vue-property-decorator. Then I setup a super basic store as per your example in the readme file.

I then tried to use this.$store in the generated 'HelloWorld.vue' component, however it finds no definition for this.$store (Property '$store' does not exist on type 'HelloWorld').

It is probably worth noting that this method imports Vue from 'vue-property-decorator' instead of from 'vue' which may affect how the .d.ts declared stuff works.

As a side note, in your setup for VueJs tests you declare $store as type any which means when you use this.$store inside a component you lose all type hinting. Is this just for testing or does this library not support proper type hinting inside components?

Any help is appreciated, I've tried adding my own definitions, but haven't had much success. It would be very helpful to have an example of how to use this library in a base TypeScript project generated by the vue cli.

has plan to compatible width vuex api ( like dispath, commit ) and vuex state ?
it could be friendly to migrate from vuex to sinai

It does not work with vue-devtool

proxyStore not return replaceState