Skip to content

Commit f5c9d9f

Browse files
Update README
1 parent 964ffb3 commit f5c9d9f

File tree

1 file changed

+9
-11
lines changed

1 file changed

+9
-11
lines changed

README.md

Lines changed: 9 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -42,16 +42,14 @@ The library works by wrapping standard Redux Toolkit functions, adding persisten
4242

4343
You can install `rtk-persist` using either `yarn` or `npm`:
4444

45-
```
45+
```bash
4646
yarn add rtk-persist
47-
4847
```
4948

5049
or
5150

52-
```
51+
```bash
5352
npm install --save rtk-persist
54-
5553
```
5654

5755
The package has a peer dependency on `@reduxjs/toolkit` and `react-redux` if you use the React integration.
@@ -70,7 +68,7 @@ This approach is best if you prefer the `createSlice` API from Redux Toolkit.
7068

7169
Replace `createSlice` with `createPersistedSlice`. The function accepts the same options.
7270

73-
```
71+
```typescript
7472
// features/counter/counterSlice.ts
7573
import { createPersistedSlice } from 'rtk-persist';
7674
import { PayloadAction } from '@reduxjs/toolkit';
@@ -106,7 +104,7 @@ This approach is ideal if you prefer the `createReducer` builder syntax.
106104

107105
Use `createPersistedReducer` and define your case reducers using the builder callback.
108106

109-
```
107+
```typescript
110108
// features/counter/counterReducer.ts
111109
import { createPersistedReducer } from 'rtk-persist';
112110
import { createAction } from '@reduxjs/toolkit';
@@ -134,7 +132,7 @@ export const counterReducer = createPersistedReducer(
134132

135133
Whichever option you choose, you must use `configurePersistedStore` and provide a storage handler. The store creation is **asynchronous** and returns a promise that resolves with the rehydrated store.
136134

137-
```
135+
```typescript
138136
// app/store.ts
139137
import { configurePersistedStore } from 'rtk-persist';
140138
import { counterSlice } from '../features/counter/counterSlice';
@@ -178,7 +176,7 @@ This component replaces the standard `Provider` from `react-redux`. It waits for
178176

179177
In your application's entry point (e.g., `main.tsx` or `index.js`), wrap your `App` component with `PersistedProvider`.
180178

181-
```
179+
```typescript
182180
// main.tsx
183181
import React from 'react';
184182
import ReactDOM from 'react-dom/client';
@@ -208,7 +206,7 @@ A custom hook that provides access to the rehydrated store instance. This is use
208206

209207
#### Usage
210208

211-
```
209+
```typescript
212210
import React from 'react';
213211
import { usePersistedStore } from 'rtk-persist';
214212

@@ -237,7 +235,7 @@ The `nestedPath` is a dot-notation string representing the path from the root of
237235

238236
Imagine your state is structured like `{ features: { counter: { value: 0 } } }`. Here's how you would configure the counter slice:
239237

240-
```
238+
```typescript
241239
// features/counter/counterSlice.ts
242240
export const counterSlice = createPersistedSlice(
243241
{
@@ -285,7 +283,7 @@ Sometimes, you may need to transform a slice's state before it's saved to storag
285283

286284
Here's how you can persist a slice that contains a non-serializable value like a `Date` object.
287285

288-
```
286+
```typescript
289287
// features/session/sessionSlice.ts
290288
import { createPersistedSlice } from 'rtk-persist';
291289

0 commit comments

Comments
 (0)