Skip to content

Commit 20772e9

Browse files
authored
chore(readme): rewritten parts to make better use of language (#1731)
1 parent 0ff728b commit 20772e9

File tree

1 file changed

+19
-19
lines changed

1 file changed

+19
-19
lines changed

README.md

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,25 @@
11
# Vuex 4
22

3-
This is the Vue 3 compatible version of Vuex. The focus is compatibility, and it provides the exact same API as Vuex 3, so users can reuse their existing Vuex code for Vue 3.
3+
This is the Vue 3 compatible version of Vuex. The focus is compatibility, and it provides the exact same API as Vuex 3, so users can reuse their existing Vuex code with Vue 3.
44

55
## Status: Beta
66

7-
All Vuex 3 feature works. There are a few breaking changes described in a later section, so please check them out. You can find basic usage with both option and composition API at `example` folder.
7+
All Vuex 3 features work. There are a few breaking changes described in a later section, so please check them out. You can find basic usage with both option and Composition API in the `example` directory.
88

9-
Please provide us feedback if you find anything. You may use [vue-next-webpack-preview](https://github.com/vuejs/vue-next-webpack-preview) to test out Vue 3 with Vuex 4.
9+
Feedback is welcome should you discover any issues. You may use [vue-next-webpack-preview](https://github.com/vuejs/vue-next-webpack-preview) to test out Vue 3 with Vuex 4.
1010

1111
## Breaking changes
1212

1313
### Installation process has changed
1414

15-
To align with the new Vue 3 initialization process, the installation process of Vuex has changed as well.
15+
To align with the new Vue 3 initialization process, the installation process of Vuex has changed.
1616

17-
You should use a new `createStore` function to create a new store instance.
17+
To create a new store instance, users are now encouraged to use the newly introduced `createStore` function.
1818

1919
```js
2020
import { createStore } from 'vuex'
2121

22-
const store = createStore({
22+
export const store = createStore({
2323
state () {
2424
return {
2525
count: 1
@@ -28,14 +28,14 @@ const store = createStore({
2828
})
2929
```
3030

31-
> This is technically not a breaking change because you could still use `new Store(...)` syntax. However, to align with Vue 3 and also with Vue Router Next, we recommend users to use `createStore` function instead.
31+
> Whilst this is not technically a breaking change, you may still use the `new Store(...)` syntax, we recommend this approach to align with Vue 3 and Vue Router Next.
3232
33-
Then to install Vuex to Vue app instance, pass the store instance instead of Vuex.
33+
To install Vuex to a Vue instance, pass the store instance instead of Vuex.
3434

3535
```js
3636
import { createApp } from 'vue'
37-
import store from './store'
38-
import App from './APP.vue'
37+
import { store } from './store'
38+
import App from './App.vue'
3939

4040
const app = createApp(App)
4141

@@ -46,26 +46,26 @@ app.mount('#app')
4646

4747
### Bundles are now aligned with Vue 3
4848

49-
The bundles are generated as below to align with Vue 3 bundles.
49+
The following bundles are generated to align with Vue 3 bundles:
5050

5151
- `vuex.global(.prod).js`
52-
- For direct use via `<script src="...">` in the browser. Exposes the Vuex global.
53-
- Note that global builds are not UMD builds. They are built as IIFEs and is only meant for direct use via `<script src="...">`.
54-
- Contains hard-coded prod/dev branches, and the prod build is pre-minified. Use the `.prod.js` files for production.
52+
- For direct use with `<script src="...">` in the browser. Exposes the Vuex global.
53+
- Global build is built as IIFE, and not UMD, and is only meant for direct use with `<script src="...">`.
54+
- Contains hard-coded prod/dev branches and the prod build is pre-minified. Use the `.prod.js` files for production.
5555
- `vuex.esm-browser(.prod).js`
56-
- For usage via native ES modules imports (in browser via `<script type="module">`.
56+
- For use with native ES module imports (including module supporting browsers via `<script type="module">`.
5757
- `vuex.esm-bundler.js`
58-
- For use with bundlers like `webpack`, `rollup` and `parcel`.
58+
- For use with bundlers such as `webpack`, `rollup` and `parcel`.
5959
- Leaves prod/dev branches with `process.env.NODE_ENV` guards (must be replaced by bundler).
6060
- Does not ship minified builds (to be done together with the rest of the code after bundling).
6161
- `vuex.cjs.js`
62-
- For use in Node.js server-side rendering via `require()`.
62+
- For use in Node.js server-side rendering with `require()`.
6363

6464
### Typings for `ComponentCustomProperties`
6565

66-
Vuex 4 removes its global typings for `this.$store` within Vue Component due to solving [issue #994](https://github.com/vuejs/vuex/issues/994). When using TypeScript, you must provide your own augment declaration.
66+
Vuex 4 removes its global typings for `this.$store` within Vue Component to solve [issue #994](https://github.com/vuejs/vuex/issues/994). When used with TypeScript, you must declare your own module augmentation.
6767

68-
Please place the following code in your project to have `this.$store` working.
68+
Place the following code in your project to allow `this.$store` to be typed correctly:
6969

7070
```ts
7171
// vuex-shim.d.ts

0 commit comments

Comments
 (0)