direct-vuex - npm Package Compare versions

Comparing version 0.8.3 to 0.8.4

package.json

		{
		"name": "direct-vuex",
		"version": "0.8.3",
		"version": "0.8.4",
		"description": "Use and implement your Vuex store with TypeScript types. Compatible with the Vue 3 composition API.",
		@@ -5,0 +5,0 @@ "author": "Paleo",

README.md

		@@ -12,2 +12,4 @@ # direct-vuex

		_Warning! BREAKING CHANGE in version 0.8: do not use `as const` with `createDirectStore`. Additionally, there is a new limitation on [how to declare a state](#a-limitation-on-how-to-declare-a-state). See also the section: [Implement a Vuex Store with typed helpers](#implement-a-vuex-store-with-typed-helpers)._

		## Install
		@@ -103,5 +105,31 @@

		## A limitation on how to declare a State

		In store and module options, the `state` property shouldn't be declared with the ES6 method syntax.

		Valid:

		```ts
		state: { p1: string } as Mod1State
		```

		```ts
		state: (): Mod1State => { p1: string }
		```

		```ts
		state: function (): Mod1State { return { p1: string } }
		```

		Invalid:

		```ts
		state(): Mod1State { return { p1: string } }
		```

		I'm not sure why but TypeScript doesn't infer the state type correctly when we write that.

		## Implement a Vuex Store with typed helpers

		Direct-Vuex provides several useful helpers for implementation of the store. They are all optional. If you want to keep your classic implementation of a Vuex Store, the only detail direct-vuex needs is the literal type of the `namespaced` property. You can write `namespaced: true as true` or append `as const` where there is a `namespaced` property. But you don't need to worry about that if you use the helpers described in the following sections.
		Direct-vuex provides several useful helpers for implementation of the store. They are all optional. However, if you want to keep your classic implementation of a Vuex Store, then direct-vuex needs to infer the literal type of the `namespaced` property. You can write `namespaced: true as true` or append `as const` where there is a `namespaced` property. But you don't need to worry about that if you use the helpers described in the following sections.

		@@ -112,3 +140,3 @@ ### In a Vuex Module

		The generated function `moduleActionContext` is a factory for creating a function `mod1ActionContext`, which converts the injected action `context` to the direct vuex one.
		The generated function `moduleActionContext` is a factory for creating a function `mod1ActionContext`, which converts the injected action `context` to the direct-vuex one.

		@@ -157,35 +185,9 @@ Here is how to use `createModule` and `moduleActionContext`:

		### A limitation on how to declare a State

		In store and module options, the `state` property shouldn't be declared with the ES6 method syntax.

		Valid:

		```ts
		state: { p1: string } as Mod1State
		```

		```ts
		state: (): Mod1State => { p1: string }
		```

		```ts
		state: function (): Mod1State { return { p1: string } }
		```

		Invalid:

		```ts
		state(): Mod1State { return { p1: string } }
		```

		I'm not sure why but TypeScript doesn't infer the state type correctly when we write that.

		### Get the typed context of a Vuex Action, but in the root store

		The generated function `rootActionContext` converts the injected action `context` to the direct vuex one, at the root level (not in a module).
		The generated function `rootActionContext` converts the injected action `context` to the direct-vuex one, at the root level (not in a module).

		```ts
		actions: {
		async actionInTheRootStore(context: any, payload) {
		async actionInTheRootStore(context, payload) {
		const { commit, state } = rootActionContext(context)
		@@ -203,7 +205,4 @@ // … Here, 'commit' and 'state' are typed.
		import { createGetters } from "direct-vuex"
		import { Mod1State } from "./mod1" // Import the local definition of the state (for example from the current module)

		export interface Mod1State {
		p1: string
		}

		export default createGetters<Mod1State>()({
		@@ -224,2 +223,3 @@ getter1(state) {
		import { createMutations } from "direct-vuex"
		import { Mod1State } from "./mod1" // Import the local definition of the state (for example from the current module)

		@@ -226,0 +226,0 @@ export default createMutations<Mod1State>()({

tests/namespaced.spec.ts

		@@ -70,2 +70,13 @@ import Vue from "vue"
		})

		test("Access to namespaced getter with parameter", async () => {
		const { store } = createDirectStore({
		getters: {
		hello: state => (name: string) => `Hello, ${name}!`
		},
		})

		const g1: string = store.getters.hello("John")
		expect(g1).toBe("Hello, John!")
		})
		})

direct-vuex - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics