Procházet zdrojové kódy

docs: add v4 docs (#1845)

Co-authored-by: Evan You <yyx990803@gmail.com>
Co-authored-by: Cue <1493221+cuebit@users.noreply.github.com>
Kia King Ishii před 4 roky
rodič
revize
c51f55f4ca
100 změnil soubory, kde provedl 9 přidání a 7707 odebrání
  1. 1 2
      .gitignore
  2. 8 2
      README.md
  3. 0 8
      docs-gitbook/LANGS.md
  4. 0 1
      docs-gitbook/assets/CNAME
  5. 0 4
      docs-gitbook/assets/circle.yml
  6. 0 34
      docs-gitbook/assets/vuex.ai
  7. 0 20
      docs-gitbook/book.json
  8. 0 19
      docs-gitbook/en/book.json
  9. 0 1
      docs-gitbook/fr/README.md
  10. 0 21
      docs-gitbook/fr/SUMMARY.md
  11. 0 178
      docs-gitbook/fr/actions.md
  12. 0 219
      docs-gitbook/fr/api.md
  13. 0 19
      docs-gitbook/fr/book.json
  14. 0 12
      docs-gitbook/fr/core-concepts.md
  15. 0 60
      docs-gitbook/fr/forms.md
  16. 0 108
      docs-gitbook/fr/getters.md
  17. 0 44
      docs-gitbook/fr/getting-started.md
  18. 0 44
      docs-gitbook/fr/hot-reload.md
  19. binární
      docs-gitbook/fr/images/flow.png
  20. binární
      docs-gitbook/fr/images/vuex.png
  21. 0 50
      docs-gitbook/fr/installation.md
  22. 0 63
      docs-gitbook/fr/intro.md
  23. 0 294
      docs-gitbook/fr/modules.md
  24. 0 172
      docs-gitbook/fr/mutations.md
  25. 0 126
      docs-gitbook/fr/plugins.md
  26. 0 109
      docs-gitbook/fr/state.md
  27. 0 25
      docs-gitbook/fr/strict.md
  28. 0 32
      docs-gitbook/fr/structure.md
  29. 0 222
      docs-gitbook/fr/testing.md
  30. binární
      docs-gitbook/gitbook/images/favicon.ico
  31. 0 1
      docs-gitbook/ja/README.md
  32. 0 21
      docs-gitbook/ja/SUMMARY.md
  33. 0 176
      docs-gitbook/ja/actions.md
  34. 0 221
      docs-gitbook/ja/api.md
  35. 0 19
      docs-gitbook/ja/book.json
  36. 0 12
      docs-gitbook/ja/core-concepts.md
  37. 0 59
      docs-gitbook/ja/forms.md
  38. 0 115
      docs-gitbook/ja/getters.md
  39. 0 44
      docs-gitbook/ja/getting-started.md
  40. 0 44
      docs-gitbook/ja/hot-reload.md
  41. 0 50
      docs-gitbook/ja/installation.md
  42. 0 66
      docs-gitbook/ja/intro.md
  43. 0 294
      docs-gitbook/ja/modules.md
  44. 0 172
      docs-gitbook/ja/mutations.md
  45. 0 126
      docs-gitbook/ja/plugins.md
  46. 0 106
      docs-gitbook/ja/state.md
  47. 0 25
      docs-gitbook/ja/strict.md
  48. 0 32
      docs-gitbook/ja/structure.md
  49. 0 221
      docs-gitbook/ja/testing.md
  50. 0 1
      docs-gitbook/kr/README.md
  51. 0 24
      docs-gitbook/kr/SUMMARY.md
  52. 0 175
      docs-gitbook/kr/actions.md
  53. 0 192
      docs-gitbook/kr/api.md
  54. 0 19
      docs-gitbook/kr/book.json
  55. 0 60
      docs-gitbook/kr/forms.md
  56. 0 91
      docs-gitbook/kr/getters.md
  57. 0 43
      docs-gitbook/kr/getting-started.md
  58. 0 44
      docs-gitbook/kr/hot-reload.md
  59. binární
      docs-gitbook/kr/images/flow.png
  60. binární
      docs-gitbook/kr/images/vuex.png
  61. 0 51
      docs-gitbook/kr/installation.md
  62. 0 63
      docs-gitbook/kr/intro.md
  63. 0 138
      docs-gitbook/kr/modules.md
  64. 0 167
      docs-gitbook/kr/mutations.md
  65. 0 126
      docs-gitbook/kr/plugins.md
  66. 0 109
      docs-gitbook/kr/state.md
  67. 0 25
      docs-gitbook/kr/strict.md
  68. 0 33
      docs-gitbook/kr/structure.md
  69. 0 222
      docs-gitbook/kr/testing.md
  70. 0 8
      docs-gitbook/old/README.md
  71. 0 0
      docs-gitbook/old/SUMMARY.md
  72. 0 1
      docs-gitbook/pt-br/README.md
  73. 0 21
      docs-gitbook/pt-br/SUMMARY.md
  74. 0 177
      docs-gitbook/pt-br/actions.md
  75. 0 217
      docs-gitbook/pt-br/api.md
  76. 0 19
      docs-gitbook/pt-br/book.json
  77. 0 12
      docs-gitbook/pt-br/core-concepts.md
  78. 0 56
      docs-gitbook/pt-br/forms.md
  79. 0 107
      docs-gitbook/pt-br/getters.md
  80. 0 43
      docs-gitbook/pt-br/getting-started.md
  81. 0 44
      docs-gitbook/pt-br/hot-reload.md
  82. binární
      docs-gitbook/pt-br/images/flow.png
  83. binární
      docs-gitbook/pt-br/images/vuex.png
  84. 0 76
      docs-gitbook/pt-br/installation.md
  85. 0 63
      docs-gitbook/pt-br/intro.md
  86. 0 287
      docs-gitbook/pt-br/modules.md
  87. 0 171
      docs-gitbook/pt-br/mutations.md
  88. 0 130
      docs-gitbook/pt-br/plugins.md
  89. 0 106
      docs-gitbook/pt-br/state.md
  90. 0 25
      docs-gitbook/pt-br/strict.md
  91. 0 30
      docs-gitbook/pt-br/structure.md
  92. 0 220
      docs-gitbook/pt-br/testing.md
  93. 0 1
      docs-gitbook/ru/README.md
  94. 0 21
      docs-gitbook/ru/SUMMARY.md
  95. 0 178
      docs-gitbook/ru/actions.md
  96. 0 219
      docs-gitbook/ru/api.md
  97. 0 19
      docs-gitbook/ru/book.json
  98. 0 12
      docs-gitbook/ru/core-concepts.md
  99. 0 60
      docs-gitbook/ru/forms.md
  100. 0 108
      docs-gitbook/ru/getters.md

+ 1 - 2
.gitignore

@@ -1,7 +1,6 @@
 /dist
-/docs/.vuepress/dist
 /coverage
-/docs/.vuepress/dist
+/docs/.vitepress/dist
 /test/e2e/reports
 /test/e2e/screenshots
 *.log

+ 8 - 2
README.md

@@ -8,6 +8,10 @@ All Vuex 3 features work. There are a few breaking changes described in a later
 
 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.
 
+## Documentation
+
+To check out docs, visit [next.vuex.vuejs.org](https://next.vuex.vuejs.org/).
+
 ## Breaking changes
 
 ### Installation process has changed
@@ -93,6 +97,8 @@ In Vuex 3, `createLogger` function was exported from `vuex/dist/logger` but it's
 import { createLogger } from 'vuex'
 ```
 
-## TODOs as of 4.0.0-rc.1
+## License
+
+[MIT](LICENCE)
 
-- Update docs
+Copyright (c) 2015-present Evan You

+ 0 - 8
docs-gitbook/LANGS.md

@@ -1,8 +0,0 @@
-* [English](en/)
-* [简体中文](zh-cn/)
-* [Português](pt-br/)
-* [Français](fr/)
-* [Русский](ru/)
-* [日本語](ja/)
-* [한국어(Korean)](kr/)
-* [1.0 Docs](old/)

+ 0 - 1
docs-gitbook/assets/CNAME

@@ -1 +0,0 @@
-vuex.vuejs.org

+ 0 - 4
docs-gitbook/assets/circle.yml

@@ -1,4 +0,0 @@
-general:
-  branches:
-    ignore:
-      - gh-pages

Rozdílová data souboru nebyla zobrazena, protože soubor je příliš velký
+ 0 - 34
docs-gitbook/assets/vuex.ai


+ 0 - 20
docs-gitbook/book.json

@@ -1,20 +0,0 @@
-{
-  "title": "Vuex",
-  "gitbook": ">3.0.0",
-  "plugins": ["edit-link", "prism", "theme-vuejs", "-fontsettings", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Edit This Page"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 19
docs-gitbook/en/book.json

@@ -1,19 +0,0 @@
-{
-  "gitbook": "2.x.x",
-  "plugins": ["edit-link", "prism", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Edit This Page"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 1
docs-gitbook/fr/README.md

@@ -1 +0,0 @@
-{% include "./SUMMARY.md" %}

+ 0 - 21
docs-gitbook/fr/SUMMARY.md

@@ -1,21 +0,0 @@
-# Vuex
-
-> Note aux utilisateurs de TypeScript : vuex@3.0+ nécessite vue@2.5+, et inversement.
-
-- [Notes de version](https://github.com/vuejs/vuex/releases)
-- [Installation](installation.md)
-- [Vuex, qu'est-ce que c'est ?](intro.md)
-- [Pour commencer](getting-started.md)
-- [Concepts de base](core-concepts.md)
-  - [État](state.md)
-  - [Accesseurs](getters.md)
-  - [Mutations](mutations.md)
-  - [Actions](actions.md)
-  - [Modules](modules.md)
-- [Structure d'une application](structure.md)
-- [Plugins](plugins.md)
-- [Mode strict](strict.md)
-- [Gestion des formulaires](forms.md)
-- [Tests](testing.md)
-- [Rechargement à chaud](hot-reload.md)
-- [Documentation de l'API](api.md)

+ 0 - 178
docs-gitbook/fr/actions.md

@@ -1,178 +0,0 @@
-# Actions
-
-Les actions sont similaires aux mutations, à la différence que :
-
-- Au lieu de modifier l'état, les actions actent des mutations.
-- Les actions peuvent contenir des opérations asynchrones.
-
-Enregistrons une simple action :
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  },
-  actions: {
-    increment (context) {
-      context.commit('increment')
-    }
-  }
-})
-```
-
-Les gestionnaires d'action reçoivent un objet contexte qui expose le même ensemble de méthodes et propriétés que l'instance du store, donc vous pouvez appeler `context.commit` pour acter une mutation, ou accéder à l'état et aux accesseurs via `context.state` et `context.getters`. Nous verrons pourquoi cet objet contexte n'est pas l'instance du store elle-même lorsque nous présenterons les [Modules](modules.md) plus tard.
-
-En pratique, nous utilisons souvent la [déstructuration d'argument](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Affecter_par_d%C3%A9composition) pour simplifier quelque peu le code (particulièrement si nous avons besoin d'appeler `commit` plusieurs fois) :
-
-``` js
-actions: {
-  increment ({ commit }) {
-    commit('increment')
-  }
-}
-```
-
-### Propager des actions
-
-Les actions sont déclenchées par la méthode `store.dispatch` :
-
-``` js
-store.dispatch('increment')
-```
-
-Cela peut sembler idiot au premier abord : si nous avons besoin d'incrémenter le compteur, pourquoi ne pas simplement appeler `store.commit('increment')` directement ? Vous rappelez-vous que **les mutations doivent être synchrones** ? Les actions ne suivent pas cette règle. Il est possible de procéder à des opérations **asynchrones** dans une action :
-
-``` js
-actions: {
-  incrementAsync ({ commit }) {
-    setTimeout(() => {
-      commit('increment')
-    }, 1000)
-  }
-}
-```
-
-Les actions prennent également en charge les paramètres additionnels (« payload ») et les objets pour propager :
-
-``` js
-// propager avec un paramètre additionnel
-store.dispatch('incrementAsync', {
-  amount: 10
-})
-
-// propager avec un objet
-store.dispatch({
-  type: 'incrementAsync',
-  amount: 10
-})
-```
-
-Un exemple concret d'application serait une action pour vider un panier d'achats, ce qui implique **d'appeler une API asynchrone** et d'**acter de multiples mutations** :
-
-``` js
-actions: {
-  checkout ({ commit, state }, products) {
-    // sauvegarder les articles actuellement dans le panier
-    const savedCartItems = [...state.cart.added]
-    // envoyer la requête de checkout,
-    // et vider le panier
-    commit(types.CHECKOUT_REQUEST)
-    // l'API de la boutique en ligne prend une fonction de rappel en cas de succès et une autre en cas d'échec
-    shop.buyProducts(
-      products,
-      // gérer le succès
-      () => commit(types.CHECKOUT_SUCCESS),
-      // gérer l'échec
-      () => commit(types.CHECKOUT_FAILURE, savedCartItems)
-    )
-  }
-}
-```
-
-Notez que nous procédons à un flux d'opérations asynchrones, et enregistrons les effets de bord (mutation de l'état) de l'action en les actant.
-
-### Propager des actions dans les composants
-
-Vous pouvez propager des actions dans les composants avec `this.$store.dispatch('xxx')`, ou en utilisant la fonction utilitaire `mapActions` qui attache les méthodes du composant aux appels de `store.dispatch` (nécessite l'injection de `store` à la racine) :
-
-``` js
-import { mapActions } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapActions([
-      'increment' // attacher `this.increment()` à `this.$store.dispatch('increment')`
-
-      // `mapActions` supporte également les paramètres additionnels :
-      'incrementBy' // attacher `this.incrementBy(amount)` à `this.$store.dispatch('incrementBy', amount)`
-    ]),
-    ...mapActions({
-      add: 'increment' // attacher `this.add()` à `this.$store.dispatch('increment')`
-    })
-  }
-}
-```
-
-### Composer les actions
-
-Les actions sont souvent asynchrones, donc comment savoir lorsqu'une action est terminée ? Et plus important, comment composer plusieurs actions ensemble pour manipuler des flux asynchrones plus complexes ?
-
-La première chose à savoir est que `store.dispatch` peut gérer la Promesse (« Promise ») retournée par le gestionnaire d'action déclenché et par conséquent vous pouvez également retourner une Promesse :
-
-``` js
-actions: {
-  actionA ({ commit }) {
-    return new Promise((resolve, reject) => {
-      setTimeout(() => {
-        commit('someMutation')
-        resolve()
-      }, 1000)
-    })
-  }
-}
-```
-
-Maintenant vous pouvez faire :
-
-``` js
-store.dispatch('actionA').then(() => {
-  // ...
-})
-```
-
-Et également dans une autre action :
-
-``` js
-actions: {
-  // ...
-  actionB ({ dispatch, commit }) {
-    return dispatch('actionA').then(() => {
-      commit('someOtherMutation')
-    })
-  }
-}
-```
-
-Pour finir, si nous utilisons [`async` / `await`](https://tc39.github.io/ecmascript-asyncawait/), nous pouvons composer nos actions ainsi :
-
-``` js
-// sachant que `getData()` et `getOtherData()` retournent des Promesses.
-
-actions: {
-  async actionA ({ commit }) {
-    commit('gotData', await getData())
-  },
-  async actionB ({ dispatch, commit }) {
-    await dispatch('actionA') // attendre que `actionA` soit finie
-    commit('gotOtherData', await getOtherData())
-  }
-}
-```
-
-> Il est possible pour un `store.dispatch` de déclencher plusieurs gestionnaires d'action dans différents modules. Dans ce genre de cas, la valeur retournée sera une Promesse qui se résout quand tous les gestionnaires déclenchés ont été résolus.

+ 0 - 219
docs-gitbook/fr/api.md

@@ -1,219 +0,0 @@
-# Documentation de l'API
-
-### `Vuex.Store`
-
-``` js
-import Vuex from 'vuex'
-
-const store = new Vuex.Store({ ...options })
-```
-
-### Options du constructeur de `Vuex.Store`
-
-- **state**
-
-  - type : `Object | Function`
-
-    L'objet d'état racine pour le store Vuex. [Plus de détails](state.md)
-
-    Si vous passez une fonction qui retourne un objet, l'objet retourné est utilisé en tant qu'état racine. Ceci est utile quand vous voulez réutiliser un objet d'état surtout dans un cas de réutilisation de module. [Plus de détails](modules.md#réutiliser-un-module)
-
-- **mutations**
-
-  - type : `{ [type: string]: Function }`
-
-    Enregistrer les mutations sur le store. La fonction gestionnaire reçoit toujours `state` comme premier argument (sera l'état local du module si défini dans un module), et reçoit le `payload` en second argument s'il y en a un.
-
-    [Plus de détails](mutations.md)
-
-- **actions**
-
-  - type : `{ [type: string]: Function }`
-
-    Enregistrer les actions sur le store. La fonction gestionnaire reçoit un objet `context` qui expose les propriétés suivantes :
-
-    ``` js
-    {
-      state,      // identique à `store.state`, ou à l'état local si dans des modules
-      rootState,  // identique à `store.state`, seulement dans des modules
-      commit,     // identique à `store.commit`
-      dispatch,   // identique à `store.dispatch`
-      getters,    // identique à `store.getters`, ou les accesseurs locaux dans les modules
-      rootGetters // identique à `store.getters`, seulement dans les modules
-    }
-    ```
-
-    [Plus de détails](actions.md)
-
-- **getters**
-
-  - type : `{ [key: string]: Function }`
-
-    Enregistrer les accesseurs sur le store. La fonction accesseur reçoit les arguments suivants :
-
-    ```
-    state,    // sera l'état local du module si défini dans un module.
-    getters   // identique à `store.getters`
-    ```
-
-    Arguments spécifiques quand défini dans un module
-
-    ```
-    state,       // sera l'état local du module si défini dans un module.
-    getters,     // module local getters of the current module
-    rootState,   // état global
-    rootGetters  // tous les accesseurs
-    ```
-
-    Les accesseurs enregistrés sont exposés sur `store.getters`.
-
-    [Plus de détails](getters.md)
-
-- **modules**
-
-  - type : `Object`
-
-    Un objet contenant des sous-modules qui seront regroupés dans le store, sous la forme suivante :
-
-    ``` js
-    {
-      key: {
-        state,
-        namespaced?,
-        mutations?,
-        actions?,
-        getters?,
-        modules?
-      },
-      ...
-    }
-    ```
-
-    Chaque module peut contenir `state` et `mutations`, tout comme les options racines. L'état d'un module sera attaché à l'état racine du store en utilisant la clé du module. Les mutations et accesseurs d'un module recevront seulement l'état local du module en premier argument au lieu de l'état racine, et le `context.state` des actions du module pointeront également vers l'état local.
-
-    [Plus de détails](modules.md)
-
-- **plugins**
-
-  - type : `Array<Function>`
-
-    Un tableau de fonctions plugins qui seront appliquées au store. Un plugin reçoit simplement le store comme seul argument et peut soit écouter les mutations (pour la persistance de données, les logs ou le débogage) ou propager des mutations (pour les données internes, c.-à-d. websockets ou observables).
-
-    [Plus de détails](plugins.md)
-
-- **strict**
-
-  - type : `Boolean`
-  - default: `false`
-
-    Force le store Vuex en mode strict. En mode strict, toute mutation de l'état en dehors des gestionnaires de mutation lancera une erreur.
-
-    [Plus de détails](strict.md)
-
-### Propriétés d'instance de `Vuex.Store`
-
-- **state**
-
-  - type : `Object`
-
-    L'état racine. Lecture seule.
-
-- **getters**
-
-  - type : `Object`
-
-    Expose les accesseurs enregistrés. Lecture seule.
-
-### Méthodes d'instance de `Vuex.Store`
-
-- **`commit(type: string, payload?: any, options?: Object)`**
-- **`commit(mutation: Object, options?: Object)`**
-
-  Acter une mutation. `options` peut avoir `root: true` ce qui permet d'acter des mutations racines dans des [modules sous espace de nom](modules.md#namespacing). [Plus de détails](mutations.md)
-
-- **`dispatch(type: string, payload?: any, options?: Object)`**
-- **`dispatch(action: Object, options?: Object)`**
-
-  Propager une action. Retourne la valeur renvoyée par le gestionnaire d'action déclenché, ou une Promesse si plusieurs gestionnaires ont été déclenchés. [Plus de détails](actions.md)
-
-- **`replaceState(state: Object)`**
-
-  Remplacer l'état racine du store. Utiliser seulement pour hydrater l'état ou dans le but de voyager dans le temps.
-
-- **`watch(getter: Function, cb: Function, options?: Object)`**
-
-  Observer de façon réactive la valeur de retour d'une fonction accesseur, et appeler la fonction de rappel lorsque la valeur change. L'accesseur reçoit l'état du store en premier argument, et les accesseurs en second argument. Accepte un objet optionnel d'options qui prend les mêmes options que la méthode `vm.$watch` de Vue.
-
-  Pour arrêter d'observer, appeler la fonction gestionnaire retournée.
-
-- **`subscribe(handler: Function)`**
-
-  S'abonner aux mutations du store. Le `handler` est appelé après chaque mutation et reçoit le descripteur de mutation et l'état post mutation comme arguments :
-
-  ``` js
-  store.subscribe((mutation, state) => {
-    console.log(mutation.type)
-    console.log(mutation.payload)
-  })
-  ```
-
-  Utilisé plus communément dans les plugins. [Plus de détails](plugins.md)
-
-- **`subscribeAction(handler: Function)`**
-
-  > Nouveau dans la 2.5.0+
-
-  S'abonner au actions du store. Le `handler` est appelé pour chaque action propagée et reçoit chaque description d'action et l'état du store courant en arguments :
-
-  ``` js
-  store.subscribeAction((action, state) => {
-    console.log(action.type)
-    console.log(action.payload)
-  })
-  ```
-
-  Souvent utiliser dans les plugins. [Pour plus de détails](plugins.md)
-
-- **`registerModule(path: string | Array<string>, module: Module, options?: Object)`**
-
-  Enregistrer un module dynamique. [Plus de détails](modules.md#enregistrement-dynamique-de-module)
-
-  `options` peut avoir `preserveState: true` qui lui permet de préserver l'état précédent. Utile pour du rendu côté serveur.
-
-- **`unregisterModule(path: string | Array<string>)`**
-
-  Supprimer un module dynamique. [Plus de détails](modules.md#enregistrement-dynamique-de-module)
-
-- **`hotUpdate(newOptions: Object)`**
-
-  Remplacement à la volée des nouvelles actions et mutations. [Plus de détails](hot-reload.md)
-
-### Fonctions utilitaires d'attachement au composant
-
-- **`mapState(namespace?: string, map: Array<string> | Object): Object`**
-
-  Créer des propriétés calculées qui retournent le sous-arbre du store Vuex au composant. [Plus de détails](state.md#le-helper-mapstate)
-
-  Le premier argument peut être de façon optionnelle une chaine d'espace de nom. [Plus de détails](modules.md#Fonctions-utilitaires-liées-avec-espace-de-nom)
-
-- **`mapGetters(namespace?: string, map: Array<string> | Object): Object`**
-
-  Créer des propriétés calculées qui retournent la valeur calculée d'un accesseur. [Plus de détails](getters.md#la-function-utilitaire-mapgetters)
-
-  Le premier argument peut être de façon optionnelle une chaine d'espace de nom. [Plus de détails](modules.md#Fonctions-utilitaires-liées-avec-espace-de-nom)
-
-- **`mapActions(namespace?: string, map: Array<string> | Object): Object`**
-
-  Créer des méthodes de composant qui propagent une action. [Plus de détails](actions.md#propager-des-actions-dans-les-composants)
-
-  Le premier argument peut être de façon optionnelle une chaine d'espace de nom. [Plus de détails](modules.md#Fonctions-utilitaires-liées-avec-espace-de-nom)
-
-- **`mapMutations(namespace?: string, map: Array<string> | Object): Object`**
-
-  Créer des méthodes de composant qui actent une mutation. [Plus de détails](mutations.md#acter-des-mutations-dans-les-composants)
-
-  Le premier argument peut être de façon optionnelle une chaine d'espace de nom. [Plus de détails](modules.md#Fonctions-utilitaires-liées-avec-espace-de-nom)
-
-- **`createNamespacedHelpers(namespace: string): Object`**
-
-  Créer des fonctions utilitaires liées avec espace de nom. L'objet retourné contient `mapState`, `mapGetters`, `mapActions` et `mapMutations` qui sont liées à l'espace de nom fourni. [Plus de détails](modules.md#fonctions-utilitaires-liées-avec-espace-de-nom)

+ 0 - 19
docs-gitbook/fr/book.json

@@ -1,19 +0,0 @@
-{
-  "gitbook": "2.x.x",
-  "plugins": ["edit-link", "prism", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Éditer cette page"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 12
docs-gitbook/fr/core-concepts.md

@@ -1,12 +0,0 @@
-# Concepts de base
-
-Nous allons apprendre les concepts de base dans Vuex avec ce chapitre. Ces concepts sont
-  - [État](state.md)
-  - [Accesseurs](getters.md)
-  - [Mutations](mutations.md)
-  - [Actions](actions.md)
-  - [Modules](modules.md)
-
-Une compréhension profonde de ces concepts est essentielle pour l'utilisation de Vuex.
-
-C'est parti.

+ 0 - 60
docs-gitbook/fr/forms.md

@@ -1,60 +0,0 @@
-# Gestion des formulaires
-
-Lorsque l'on utilise Vuex en mode strict, il peut être compliqué d'utiliser `v-model` sur une partie de l'état qui appartient à Vuex :
-
-``` html
-<input v-model="obj.message">
-```
-
-Supposons que `obj` est une propriété calculée qui retourne un objet depuis le store, le `v-model` tentera de muter directement `obj.message` lorsque l'utilisateur saisit du texte dans le champ. En mode strict, cela produira une erreur car la mutation n'est pas effectuée dans un gestionnaire de mutation Vuex explicite.
-
-La « méthode Vuex » pour gérer ça est de lier la valeur de l'`input` et d'appeler une action sur l'évènement `input` ou `change` :
-
-``` html
-<input :value="message" @input="updateMessage">
-```
-``` js
-// ...
-computed: {
-  ...mapState({
-    message: state => state.obj.message
-  })
-},
-methods: {
-  updateMessage (e) {
-    this.$store.commit('updateMessage', e.target.value)
-  }
-}
-```
-
-Et voici le gestionnaire de mutation :
-
-``` js
-// ...
-mutations: {
-  updateMessage (state, message) {
-    state.obj.message = message
-  }
-}
-```
-
-### Propriété calculée bidirectionnelle
-
-Admettons tout de même que l'exemple ci-dessus est plus verbeux que le `v-model` couplé à l'état local (tout en perdant quelques fonctionnalités pratiques de `v-model` au passage). Une approche alternative consiste à utiliser une propriété calculée bidirectionnelle avec un mutateur :
-
-``` html
-<input v-model="message">
-```
-``` js
-// ...
-computed: {
-  message: {
-    get () {
-      return this.$store.state.obj.message
-    },
-    set (value) {
-      this.$store.commit('updateMessage', value)
-    }
-  }
-}
-```

+ 0 - 108
docs-gitbook/fr/getters.md

@@ -1,108 +0,0 @@
-# Accesseurs
-
-Parfois nous avons besoin de calculer des valeurs basées sur l'état du store, par exemple pour filtrer une liste d'éléments et les compter :
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.state.todos.filter(todo => todo.done).length
-  }
-}
-```
-
-Si plus d'un composant a besoin d'utiliser cela, il nous faut ou bien dupliquer cette fonction, ou bien l'extraire dans une fonction utilitaire séparée et l'importer aux endroits nécessaires. Les deux idées sont loin d'être idéales.
-
-Vuex nous permet de définir des accesseurs (« getters ») dans le store. Voyez-les comme les propriétés calculées des stores. Comme pour les propriétés calculées, le résultat de l'accesseur est mis en cache en se basant sur ses dépendances et il ne sera réévalué que lorsque l'une de ses dépendances aura changée.
-
-Les accesseurs prennent l'état en premier argument :
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    todos: [
-      { id: 1, text: '...', done: true },
-      { id: 2, text: '...', done: false }
-    ]
-  },
-  getters: {
-    doneTodos: state => {
-      return state.todos.filter(todo => todo.done)
-    }
-  }
-})
-```
-
-Les accesseurs seront exposés sur l'objet `store.getters` :
-
-``` js
-store.getters.doneTodos // -> [{ id: 1, text: '...', done: true }]
-```
-
-Les accesseurs recevront également les autres accesseurs en second argument :
-
-``` js
-getters: {
-  // ...
-  doneTodosCount: (state, getters) => {
-    return getters.doneTodos.length
-  }
-}
-```
-
-``` js
-store.getters.doneTodosCount // -> 1
-```
-
-Nous pouvons maintenant facilement les utiliser dans n'importe quel composant :
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.getters.doneTodosCount
-  }
-}
-```
-
-Vous pouvez aussi passer des arguments aux accesseurs en retournant une fonction. Cela est particulièrement utile quand vous souhaitez interroger un tableau dans le store :
-
-```js
-getters: {
-  // ...
-  getTodoById: (state) => (id) => {
-    return state.todos.find(todo => todo.id === id)
-  }
-}
-```
-
-``` js
-store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }
-```
-
-### La fonction utilitaire `mapGetters`
-
-La fonction utilitaire `mapGetters` attache simplement vos accesseurs du store aux propriétés calculées locales :
-
-``` js
-import { mapGetters } from 'vuex'
-
-export default {
-  // ...
-  computed: {
-    // rajouter les accesseurs dans `computed` avec l'opérateur de décomposition
-    ...mapGetters([
-      'doneTodosCount',
-      'anotherGetter',
-      // ...
-    ])
-  }
-}
-```
-
-Si vous voulez attacher un accesseur avec un nom différent, utilisez un objet :
-
-``` js
-...mapGetters({
-  // attacher `this.doneCount` à `store.getters.doneTodosCount`
-  doneCount: 'doneTodosCount'
-})
-```

+ 0 - 44
docs-gitbook/fr/getting-started.md

@@ -1,44 +0,0 @@
-# Pour commencer
-
-Au cœur de chaque application Vuex, il y a la **zone de stockage (« store »)**. Un « store » est tout simplement un conteneur avec l'**état (« state »)** de votre application. Il y a deux choses qui différencient un store Vuex d'un simple objet global :
-
-1. Les stores Vuex sont réactifs. Quand les composants Vue y récupèrent l'état, ils se mettront à jour de façon réactive et efficace si l'état du store a changé.
-
-2. Vous ne pouvez pas muter directement l'état du store. La seule façon de modifier l'état d'un store est d'**acter (« commit »)** explicitement des **mutations**. Cela assure que chaque état laisse un enregistrement traçable, et permet à des outils de nous aider à mieux appréhender nos applications.
-
-### Le store le plus simple
-
-> **NOTE:** Nous allons utiliser la syntaxe ES2015 dans les exemples de code pour le reste de la documentation. Si vous ne vous êtes pas encore penché dessus, [vous devriez](https://babeljs.io/docs/learn-es2015/) !
-
-Après [avoir installé](installation.md) Vuex, nous allons créer un store. C'est assez simple ; définissez juste un objet d'état initial et quelques mutations :
-
-``` js
-// Assurez vous d'appeler `Vue.use(Vuex)` en premier lieu si vous utilisez un système de module
-
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  }
-})
-```
-
-Maintenant, vous pouvez accéder à l'objet d'état avec `store.state`, et déclencher un changement d'état avec la méthode `store.commit` :
-
-``` js
-store.commit('increment')
-
-console.log(store.state.count) // -> 1
-```
-
-Encore une fois, la raison pour laquelle nous actons une mutation au lieu de modifier `store.state.count` directement, c'est parce que nous voulons le tracer explicitement. Cette simple convention rend votre intention plus explicite, ainsi vous pouvez raisonner plus facilement les changements d'état en lisant votre code. De plus, cela nous donne l'opportunité d'implémenter des outils qui peuvent enregistrer chaque mutation, prendre des instantanés de l'état, ou même procéder à de la visualisation d'état dans le temps.
-
-Utiliser l'état du store dans un composant implique simplement de retourner l'état dans une *propriété calculée*, car l'état du store est réactif. Déclencher des changements signifie simplement d'acter des mutations dans les méthodes du composant.
-
-Voici un exemple de l'[application de comptage Vuex la plus basique](https://jsfiddle.net/n9jmu5v7/1269/).
-
-Ensuite, nous allons examiner chaque concept de base plus en détails, et commençons avec l'[État](state.md).

+ 0 - 44
docs-gitbook/fr/hot-reload.md

@@ -1,44 +0,0 @@
-# Rechargement à chaud
-
-Vuex prend en charge le rechargement à chaud des mutations, modules, actions et accesseurs durant le développement, en utilisant l'[API du module de remplacement à chaud](https://webpack.js.org/guides/hot-module-replacement/) de webpack. Vous pouvez également utiliser Browserify avec le plugin [browserify-hmr](https://github.com/AgentME/browserify-hmr/).
-
-Pour les mutations et les modules, vous aurez besoin d'utiliser la méthode d'API `store.hotUpdate()` :
-
-``` js
-// store.js
-import Vue from 'vue'
-import Vuex from 'vuex'
-import mutations from './mutations'
-import moduleA from './modules/a'
-
-Vue.use(Vuex)
-
-const state = { ... }
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  modules: {
-    a: moduleA
-  }
-})
-
-if (module.hot) {
-  // accepter les actions et mutations en tant que module à chaud
-  module.hot.accept(['./mutations', './modules/a'], () => {
-    // requiert les modules à jour
-    // ajout de `.default` ici pour les sorties des modules babel 6
-    const newMutations = require('./mutations').default
-    const newModuleA = require('./modules/a').default
-    // remplacer les nouvelles actions et mutations
-    store.hotUpdate({
-      mutations: newMutations,
-      modules: {
-        a: newModuleA
-      }
-    })
-  })
-}
-```
-
-Jetez un œil à [l'exemple counter-hot](https://github.com/vuejs/vuex/tree/dev/examples/counter-hot) pour jouer avec du rechargement à chaud.

binární
docs-gitbook/fr/images/flow.png


binární
docs-gitbook/fr/images/vuex.png


+ 0 - 50
docs-gitbook/fr/installation.md

@@ -1,50 +0,0 @@
-# Installation
-
-### Téléchargement direct / CDN
-
-[https://unpkg.com/vuex](https://unpkg.com/vuex)
-
-<!--email_off-->
-[Unpkg.com](https://unpkg.com) fournit des liens CDN basés sur npm. Le lien ci-dessus pointera toujours vers la dernière release sur npm. Vous pouvez aussi utiliser un tag ou une version spécifique via un URL comme `https://unpkg.com/vuex@2.0.0`.
-<!--/email_off-->
-
-Incluez `vuex` après Vue et l'installation sera automatique :
-
-``` html
-<script src="/path/to/vue.js"></script>
-<script src="/path/to/vuex.js"></script>
-```
-
-### npm
-
-``` bash
-npm install vuex --save
-```
-
-### Yarn
-
-``` bash
-yarn add vuex
-```
-
-Lorsqu'il est utilisé avec un système de module, vous devez explicitement installer Vuex via `Vue.use()`:
-
-``` js
-import Vue from 'vue'
-import Vuex from 'vuex'
-
-Vue.use(Vuex)
-```
-
-Vous n'avez pas besoin de faire cela lors de l'utilisation des balises de script globales (`<script>`).
-
-### Build de développement
-
-Vous aurez besoin de cloner directement vuex depuis GitHub et le compiler vous-même si vous souhaitez utiliser le dernier build de développement.
-
-``` bash
-git clone https://github.com/vuejs/vuex.git node_modules/vuex
-cd node_modules/vuex
-npm install
-npm run build
-```

+ 0 - 63
docs-gitbook/fr/intro.md

@@ -1,63 +0,0 @@
-# Vuex, qu'est-ce que c'est ?
-
-Vuex est un **_gestionnaire d'état (« state management pattern »)_ et une bibliothèque** pour des applications Vue.js. Il sert de zone de stockage de données centralisée pour tous les composants dans une application, avec des règles pour s'assurer que l'état ne puisse subir de mutations que d'une manière prévisible. Il s'intègre également avec [l'extension officielle](https://github.com/vuejs/vue-devtools) de Vue afin de fournir des fonctionnalités avancées comme de la visualisation d'état dans le temps et des exports et imports d’instantanés (« snapshot ») d'état.
-
-### Un « gestionnaire d'état », qu'est-ce que c'est ?
-
-Commençons par une simple application de comptage avec Vue :
-
-``` js
-new Vue({
-  // état
-  data () {
-    return {
-      count: 0
-    }
-  },
-  // vue
-  template: `
-    <div>{{ count }}</div>
-  `,
-  // actions
-  methods: {
-    increment () {
-      this.count++
-    }
-  }
-})
-```
-
-C'est une application autosuffisante avec les parties suivantes :
-
-- L'**état**, qui est la source de vérité qui pilote votre application,
-- La **vue**, qui est une réflexion déclarative de l'**état**,
-- Les **actions**, qui sont les façons possibles pour l'état de changer en réaction aux actions utilisateurs depuis la **vue**.
-
-Voici une représentation extrêmement simple du concept de « flux de donnée unidirectionnel » :
-
-<p style="text-align: center; margin: 2em">
-  <img style="width:100%;max-width:450px;" src="./images/flow.png">
-</p>
-
-Cependant, la simplicité s'évapore rapidement lorsque nous avons **de multiples composants qui partagent un même état global** :
-
-- Plusieurs vues peuvent dépendre de la même partie de l'état global.
-- Des actions dans différentes vues peuvent avoir besoin de muter la même partie de l'état global.
-
-Pour le premier problème, passer des props peut être fastidieux pour les composants profondément imbriqués, et ça ne fonctionne tout simplement pas pour les composants d'un même parent. Pour le deuxième problème, on se retrouve souvent à se rabattre sur des solutions telles qu'accéder aux références d'instance du parent/enfant direct ou essayer de muter et synchroniser de multiples copies de l'état via des évènements. Ces deux modèles sont fragiles et posent rapidement des problèmes de maintenabilité du code.
-
-Alors pourquoi ne pas extraire l'état global partagé des composants, et le gérer dans un singleton global ? De cette manière, notre arbre de composant devient une grosse « vue », et n'importe quel composant peut accéder à l'état global ou déclencher des actions, peu importe où il se trouve dans l'arbre !
-
-De plus, en définissant et en séparant les concepts impliqués dans la gestion de l'état global et en appliquant certaines règles, on donne aussi une structure et une maintenabilité à notre code.
-
-Voilà l'idée de base derrière Vuex, inspiré par [Flux](https://facebook.github.io/flux/docs/overview), [Redux](http://redux.js.org/) et [l'architecture Elm](https://guide.elm-lang.org/architecture/). À l'inverse des autres modèles, Vuex est aussi une bibliothèque d'implémentation conçue spécialement pour Vue.js afin de bénéficier de son système de réactivité granulaire pour des modifications efficaces.
-
-![vuex](./images/vuex.png)
-
-### Quand l'utiliser ?
-
-Bien que Vuex nous aide à gérer un état global partagé, il apporte aussi le cout de nouveaux concepts et _abstraction de code_ (« boilerplate »). C'est un compromis entre la productivité à court terme et à long terme.
-
-Si vous n'avez jamais créé une _application monopage_ à grande échelle et que vous sautez directement dans Vuex, cela peut paraitre verbeux et intimidant. C'est parfaitement normal ; si votre application est simple, vous vous en sortirez sans doute très bien sans Vuex. Un simple [canal d'évènement global](https://fr.vuejs.org/v2/guide/components.html#Communication-non-parent-enfant) pourrait très bien vous suffire. Mais si vous devez créer une application monopage à moyenne ou grande échelle, il y a des chances que vous vous trouviez dans des situations qui vous feront vous interroger sur une meilleure gestion de l'état global, détaché de votre composant Vue, et Vuex sera naturellement la prochaine étape pour vous. Voici une bonne citation de Dan Abramov, l'auteur de Redux :
-
-> « Les librairies Flux, c'est comme les lunettes : vous saurez quand vous en aurez besoin. »

+ 0 - 294
docs-gitbook/fr/modules.md

@@ -1,294 +0,0 @@
-# Modules
-
-Du fait de l'utilisation d'un arbre d'état unique, tout l'état de notre application est contenu dans un seul et même gros objet. Cependant, au fur et à mesure que notre application grandit, le store peut devenir très engorgé.
-
-Pour y remédier, Vuex nous permet de diviser notre store en **modules**. Chaque module peut contenir ses propres états, mutations, actions, accesseurs. Il peut même contenir ses propres modules internes.
-
-``` js
-const moduleA = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... },
-  getters: { ... }
-}
-
-const moduleB = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... }
-}
-
-const store = new Vuex.Store({
-  modules: {
-    a: moduleA,
-    b: moduleB
-  }
-})
-
-store.state.a // -> l'état du `moduleA`
-store.state.b // -> l'état du `moduleB`
-```
-
-### État local d'un module
-
-Dans les mutations et accesseurs d'un module, le premier argument reçu sera **l'état local du module**.
-
-``` js
-const moduleA = {
-  state: { count: 0 },
-  mutations: {
-    increment (state) {
-      // `state` est l'état du module local
-      state.count++
-    }
-  },
-
-  getters: {
-    doubleCount (state) {
-      return state.count * 2
-    }
-  }
-}
-```
-
-De façon similaire, dans les actions du module, `context.state` exposera l'état local, et l'état racine sera disponible avec `context.rootState` :
-
-``` js
-const moduleA = {
-  // ...
-  actions: {
-    incrementIfOddOnRootSum ({ state, commit, rootState }) {
-      if ((state.count + rootState.count) % 2 === 1) {
-        commit('increment')
-      }
-    }
-  }
-}
-```
-
-Également, dans les accesseurs du module, l'état racine sera exposé en troisième argument :
-
-``` js
-const moduleA = {
-  // ...
-  getters: {
-    sumWithRootCount (state, getters, rootState) {
-      return state.count + rootState.count
-    }
-  }
-}
-```
-
-### Espace de nom
-
-Par défaut, les actions, mutations et accesseurs à l'intérieur d'un module sont toujours enregistrés sous l'**espace de nom global**. Cela permet à de multiples modules d'être réactifs au même type de mutation et d'action.
-
-Si vous souhaitez que votre module soit autosuffisant et réutilisable, vous pouvez le ranger sous un espace de nom avec `namespaced: true`. Quand le module est enregistré, tous ses accesseurs, actions et mutations seront automatiquement basés sur l'espace de nom du module dans lesquels ils sont rangés. Par exemple :
-
-```js
-const store = new Vuex.Store({
-  modules: {
-    account: {
-      namespaced: true,
-
-      // propriétés du module
-      state: { ... }, // l'état du module est déjà imbriqué et n'est pas affecté par l'option `namespace`
-      getters: {
-        isAdmin () { ... } // -> getters['account/isAdmin']
-      },
-      actions: {
-        login () { ... } // -> dispatch('account/login')
-      },
-      mutations: {
-        login () { ... } // -> commit('account/login')
-      },
-
-      // modules imbriqués
-      modules: {
-        // hérite de l'espace de nom du module parent
-        myPage: {
-          state: { ... },
-          getters: {
-            profile () { ... } // -> getters['account/profile']
-          }
-        },
-
-        // utilise un espace de nom imbriqué
-        posts: {
-          namespaced: true,
-
-          state: { ... },
-          getters: {
-            popular () { ... } // -> getters['account/posts/popular']
-          }
-        }
-      }
-    }
-  }
-})
-```
-
-Les accesseurs et actions sous espace de nom reçoivent des `getters`, `dispatch` et `commit` localisés. En d'autres termes, vous pouvez utiliser les paramètres de module sans écrire de préfixe dans ce même module. Permuter entre un espace de nom ou non n'affecte pas le code à l'intérieur du module.
-
-#### Accéder aux propriétés globales dans les modules à espace de nom
-
-Si vous voulez utiliser des états et accesseurs globaux, `rootState` et `rootGetters` sont passés en 3ᵉ et 4ᵉ arguments des fonctions d'accès et sont également exposés en tant que propriété de l'objet `context` passé aux fonctions d'action.
-
-Pour propager les actions ou les mutations actées dans l'espace de nom global, passez `{ root: true }` en 3ᵉ argument à `dispatch` et `commit`.
-
-``` js
-modules: {
-  foo: {
-    namespaced: true,
-
-    getters: {
-      // Les `getters` sont localisés dans le module des accesseurs
-      // vous pouvez utiliser `rootGetters` via le 4ᵉ argument des accesseurs
-      someGetter (state, getters, rootState, rootGetters) {
-        getters.someOtherGetter // -> 'foo/someOtherGetter'
-        rootGetters.someOtherGetter // -> 'someOtherGetter'
-      },
-      someOtherGetter: state => { ... }
-    },
-
-    actions: {
-      // les actions et mutations sont aussi localisées pour ce module
-      // elles vont accepter une option `root` pour la racine des actions et mutations.
-      someAction ({ dispatch, commit, getters, rootGetters }) {
-        getters.someGetter // -> 'foo/someGetter'
-        rootGetters.someGetter // -> 'someGetter'
-
-        dispatch('someOtherAction') // -> 'foo/someOtherAction'
-        dispatch('someOtherAction', null, { root: true }) // -> 'someOtherAction'
-
-        commit('someMutation') // -> 'foo/someMutation'
-        commit('someMutation', null, { root: true }) // -> 'someMutation'
-      },
-      someOtherAction (ctx, payload) { ... }
-    }
-  }
-}
-```
-
-#### Fonctions utilitaires liées avec espace de nom
-
-Quand nous lions un module sous espace de nom à un composant avec les fonctions utilitaires `mapState`, `mapGetters`, `mapActions` and `mapMutations`, cela peut être légèrement verbeux :
-
-``` js
-computed: {
-  ...mapState({
-    a: state => state.some.nested.module.a,
-    b: state => state.some.nested.module.b
-  })
-},
-methods: {
-  ...mapActions([
-    'some/nested/module/foo',
-    'some/nested/module/bar'
-  ])
-}
-```
-
-Dans ces cas-là, vous pouvez passer une chaine de caractère représentant le nom d'espace en tant que premier argument aux fonctions utilitaires ainsi toutes les liaisons seront faites en utilisant le module comme contexte. Cela peut être simplifié comme ci-dessous :
-
-``` js
-computed: {
-  ...mapState('some/nested/module', {
-    a: state => state.a,
-    b: state => state.b
-  })
-},
-methods: {
-  ...mapActions('some/nested/module', [
-    'foo',
-    'bar'
-  ])
-}
-```
-
-De plus, vous pouvez créer des fonctions utilitaires liées avec espace de nom en utilisant `createNamespacedHelpers`. Cela retourne un objet qui a les nouvelles fonctions utilitaires rattachées à la valeur d'espace de nom fournie :
-
-``` js
-import { createNamespacedHelpers } from 'vuex'
-
-const { mapState, mapActions } = createNamespacedHelpers('some/nested/module')
-
-export default {
-  computed: {
-    // vérifie dans `some/nested/module`
-    ...mapState({
-      a: state => state.a,
-      b: state => state.b
-    })
-  },
-  methods: {
-    // vérifie dans `some/nested/module`
-    ...mapActions([
-      'foo',
-      'bar'
-    ])
-  }
-}
-```
-
-#### Limitations pour les plugins des développeurs
-
-Vous devez faire attention au nom d'espace imprévisible pour vos modules quand vous créez un [plugin](plugins.md) qui fournit les modules et laisser les utilisateurs les ajouter au store de Vuex. Vos modules seront également sous espace de nom si l'utilisateur du plugin l'ajoute sous un module sous espace de nom. Pour vous adapter à la situation, vous devez recevoir la valeur de l'espace de nom via vos options de plugin :
-
-```js
-// passer la valeur d'espace de nom via une option du plugin
-// et retourner une fonction de plugin Vuex
-export function createPlugin (options = {}) {
-  return function (store) {
-    // ajouter l'espace de nom aux types de module
-    const namespace = options.namespace || ''
-    store.dispatch(namespace + 'pluginAction')
- }
-}
-```
-
-### Enregistrement dynamique de module
-
-Vous pouvez enregistrer un module **après** que le store ait été créé avec la méthode `store.registerModule` :
-
-``` js
-// enregistrer un module `myModule`
-store.registerModule('myModule', {
-  // ...
-})
-
-// enregistrer un module imbriqué `nested/myModule`
-store.registerModule(['nested', 'myModule'], {
-  // ...
-})
-```
-
-L'état des modules est disponible dans `store.state.myModule` et `store.state.nested.myModule`.
-
-L'enregistrement dynamique de module permet aux autres plugins Vue de bénéficier de la gestion de l'état de Vuex en attachant un module au store de l'application. Par exemple, la bibliothèque [`vuex-router-sync`](https://github.com/vuejs/vuex-router-sync) intègre vue-router avec vuex en gérant l'état de la route d'application dans un module enregistré dynamiquement.
-
-Vous pouvez aussi supprimer un module enregistré dynamiquement avec `store.unregisterModule(moduleName)`. Notez que vous ne pouvez pas supprimer des modules statiques (déclarés à la création du store) avec cette méthode.
-
-Il est possible que vous souhaitiez préserver un état précédent quand vous abonnez un nouveau module. Par exemple préserver l'état depuis l'application rendue côté serveur. Vous pouvez réaliser ceci avec l'option `preserveState` : `store.registerModule('a', module, { preserveState: true })`.
-
-### Réutiliser un module
-
-Parfois nous devrons créer de multiples instances d'un module pour, par exemple :
-
-- créer plusieurs stores qui utilisent le même module (par ex. pour [éviter les singletons d'état avec du SSR](https://ssr.vuejs.org/fr/structure.html#avoid-stateful-singletons) quand l'option `runInNewContext` est à `false` ou `'once'`) ou
-- enregistrer le même module plusieurs fois dans le même store.
-
-Si nous utilisons un objet pour déclarer l'état du module, alors cet objet d'état sera partagé par référence et causera de contamination inter store/module quand il sera muté.
-
-C'est exactement le même problème qu'avec `data` dans un composant Vue. Ainsi la solution est là même, utiliser une fonction pour déclarer notre état de module (supporté par la 2.3.0+) :
-
-``` js
-const MyReusableModule = {
-  state () {
-    return {
-      foo: 'bar'
-    }
-  },
-  // mutations, actions, accesseurs...
-}
-```

+ 0 - 172
docs-gitbook/fr/mutations.md

@@ -1,172 +0,0 @@
-# Mutations
-
-La seule façon de vraiment modifier l'état dans un store Vuex est d'acter une mutation. Les mutations Vuex sont très similaires aux évènements : chaque mutation a un **type** sous forme de chaine de caractères et un **gestionnaire**. La fonction de gestion est en charge de procéder aux véritables modifications de l'état, et elle reçoit l'état en premier argument :
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 1
-  },
-  mutations: {
-    increment (state) {
-      // muter l'état
-      state.count++
-    }
-  }
-})
-```
-
-Vous ne pouvez pas appeler directement un gestionnaire de mutation. Le parti-pris ici est proche de l'abonnement à un évènement : « Lorsqu'une mutation du type `increment` est déclenchée, appelle ce gestionnaire. » Pour invoquer un gestionnaire de mutation, il faut appeler `store.commit` avec son type :
-
-``` js
-store.commit('increment')
-```
-
-### Acter avec un argument additionnel
-
-Vous pouvez donner un argument additionnel (« payload ») à la fonction `store.commit` lors de la mutation :
-
-``` js
-// ...
-mutations: {
-  increment (state, n) {
-    state.count += n
-  }
-}
-```
-``` js
-store.commit('increment', 10)
-```
-
-Dans la plupart des cas, l'argument additionnel devrait être un objet, ainsi il peut contenir plusieurs champs, et les mutations enregistrées seront également plus descriptives :
-
-``` js
-// ...
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-``` js
-store.commit('increment', {
-  amount: 10
-})
-```
-
-### Acter avec un objet
-
-Une méthode alternative pour acter une mutation est d'utiliser directement un objet qui a une propriété `type` :
-
-``` js
-store.commit({
-  type: 'increment',
-  amount: 10
-})
-```
-
-Lors de l'utilisation d'un objet pour acter, c'est l'objet lui-même qui ferra office d'argument pour aux gestionnaires de mutation, le gestionnaire reste donc inchangé :
-
-``` js
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-### Les mutations suivent les règles de réactivité de Vue
-
-Puisqu'un état de store de Vuex est rendu réactif par Vue, lorsque nous mutons l'état, les composants Vue observant cet état seront automatiquement mis à jour. Cela signifie également que les mutations Vuex sont sujettes aux mêmes limitations qu'avec l'utilisation de Vue seul :
-
-1. Initialisez de préférence le store initial de votre état avec tous les champs désirés auparavant.
-
-2. Lorsque vous ajoutez de nouvelles propriétés à un objet, vous devriez soit :
-
-  - Utiliser `Vue.set(obj, 'newProp', 123)`, ou
-
-  - Remplacer cet objet par un nouvel objet. Par exemple, en utilisant [opérateur de décomposition](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateur_de_d%C3%A9composition) (stage-2), il est possible d'écrire :
-
-    ``` js
-    state.obj = { ...state.obj, newProp: 123 }
-    ```
-
-### Utilisation de constante pour les types de mutation
-
-C'est une façon de faire régulière que d'utiliser des constantes pour les types de mutations dans diverses implémentations de Flux. Cela permet au code de bénéficier d'outils comme les linters (des outils d'aide à l'analyse syntaxique), et écrire toutes ces constantes dans un seul fichier permet à vos collaborateurs d'avoir un aperçu de quelles mutations sont possibles dans toute l'application :
-
-``` js
-// mutation-types.js
-export const SOME_MUTATION = 'SOME_MUTATION'
-```
-
-``` js
-// store.js
-import Vuex from 'vuex'
-import { SOME_MUTATION } from './mutation-types'
-
-const store = new Vuex.Store({
-  state: { ... },
-  mutations: {
-    // nous pouvons utiliser la fonctionnalité de nom de propriété calculée
-    // pour utiliser une constante en tant que nom de fonction
-    [SOME_MUTATION] (state) {
-      // muter l'état
-    }
-  }
-})
-```
-
-Utiliser les constantes ou non relève de la préférence personnelle. Cela peut être bénéfique sur un gros projet avec beaucoup de développeurs, mais c'est totalement optionnel si vous n'aimez pas cette pratique.
-
-### Les mutations doivent être synchrones
-
-Une règle importante à retenir est que **les fonctions de gestion des mutations doivent être synchrones**. Pourquoi ? Considérons l'exemple suivant :
-
-``` js
-mutations: {
-  someMutation (state) {
-    api.callAsyncMethod(() => {
-      state.count++
-    })
-  }
-}
-```
-
-Maintenant imaginons que nous déboguons l'application et que nous regardons dans les logs de mutation des outils de développement (« devtools »). Pour chaque mutation enregistrée, le devtool aura besoin de capturer un instantané de l'état « avant » et un instantané « après ». Cependant, la fonction de rappel asynchrone de l'exemple ci-dessus rend l'opération impossible : la fonction de rappel n'est pas encore appelée lorsque la mutation est actée, et il n'y a aucun moyen pour le devtool de savoir quand la fonction de rappel sera véritablement appelée. Toute mutation d'état effectuée dans la fonction de rappel est essentiellement intraçable !
-
-### Acter des mutations dans les composants
-
-Vous pouvez acter des mutations dans les composants avec `this.$store.commit('xxx')`, ou en utilisant la fonction utilitaire `mapMutations` qui attache les méthodes du composant aux appels de `store.commit` (nécessite l'injection de `store` à la racine) :
-
-``` js
-import { mapMutations } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapMutations([
-      'increment' // attacher `this.increment()` à `this.$store.commit('increment')`
-
-      // `mapMutations` supporte également les paramètres additionnels :
-      'incrementBy' // attacher `this.incrementBy(amount)` à `this.$store.commit('incrementBy', amount)`
-    ]),
-    ...mapMutations({
-      add: 'increment' // attacher `this.add()` à `this.$store.commit('increment')`
-    })
-  }
-}
-```
-
-### En avant vers les actions
-
-L'asynchronisme combiné à la mutation de l'état peut rendre votre programme très difficile à comprendre. Par exemple, lorsque vous appelez deux méthodes avec toutes les deux des fonctions de rappel asynchrones qui changent l'état, comment savez-vous quelle fonction de rappel est appelée en première ? C'est exactement la raison pour laquelle nous voulons séparer les deux concepts. Avec Vuex, **les mutations sont des transactions synchrones** :
-
-``` js
-store.commit('increment')
-// n'importe quel changement d'état de « increment » par mutation
-// devrait être faite de manière synchrone.
-```
-
-Pour gérer les opérations asynchrones, tournons-nous vers les [Actions](actions.md).

+ 0 - 126
docs-gitbook/fr/plugins.md

@@ -1,126 +0,0 @@
-# Plugins
-
-Les stores Vuex prennent une option `plugins` qui expose des hooks pour chaque mutation. Un plugin Vuex est simplement une fonction qui reçoit un store comme unique argument :
-
-``` js
-const myPlugin = store => {
-  // appelé quand le store est initialisé
-  store.subscribe((mutation, state) => {
-    // appelé après chaque mutation.
-    // Les mutations arrivent au format `{ type, payload }`.
-  })
-}
-```
-
-Et peut être utilisé ainsi :
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: [myPlugin]
-})
-```
-
-### Acter des mutations dans des plugins
-
-Les plugins ne sont pas autorisés à muter directement l'état. Tout comme vos composants, ils peuvent simplement déclencher des changements en actant des mutations.
-
-En actant des mutations, un plugin peut être utilisé pour synchroniser la source de données avec le store. Par exemple, pour synchroniser la source de données d'une websocket vers le store (c'est juste un exemple artificiel, en réalité la fonction `createPlugin` peut prendre des options additionnelles pour des tâches plus complexes) :
-
-``` js
-export default function createWebSocketPlugin (socket) {
-  return store => {
-    socket.on('data', data => {
-      store.commit('receiveData', data)
-    })
-    store.subscribe(mutation => {
-      if (mutation.type === 'UPDATE_DATA') {
-        socket.emit('update', mutation.payload)
-      }
-    })
-  }
-}
-```
-
-``` js
-const plugin = createWebSocketPlugin(socket)
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  plugins: [plugin]
-})
-```
-
-### Prendre des instantanés de l'état
-
-Parfois un plugin peut vouloir recevoir des « instantanés » de l'état, et également comparer l'état post mutation avec l'état prémutation. Pour faire ceci, vous aurez besoin d'effectuer une copie complète de l'état :
-
-``` js
-const myPluginWithSnapshot = store => {
-  let prevState = _.cloneDeep(store.state)
-  store.subscribe((mutation, state) => {
-    let nextState = _.cloneDeep(state)
-
-    // comparer `prevState` et `nextState`...
-
-    // sauver l'état pour la prochaine mutation
-    prevState = nextState
-  })
-}
-```
-
-**Les plugins qui peuvent prendre des instantanés ne devraient être utilisés que pendant le développement.** Lorsqu'on utilise webpack ou Browserify, on peut laisser nos outils de développement (« devtools ») s'occuper de ça pour nous :
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: process.env.NODE_ENV !== 'production'
-    ? [myPluginWithSnapshot]
-    : []
-})
-```
-
-Le plugin sera utilisé par défaut. Pour la production, vous aurez besoin de [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) pour webpack ou de [envify](https://github.com/hughsk/envify) pour Browserify pour convertir la valeur de `process.env.NODE_ENV !== 'production'` à `false` pour le build final.
-
-### Plugin de logs intégré
-
-> Si vous utilisez [vue-devtools](https://github.com/vuejs/vue-devtools) vous n'avez probablement pas besoin de ça.
-
-Vuex fournit un plugin de logs à des fins de débogage :
-
-``` js
-import createLogger from 'vuex/dist/logger'
-
-const store = new Vuex.Store({
-  plugins: [createLogger()]
-})
-```
-
-La fonction `createLogger` prend quelques options :
-
-``` js
-const logger = createLogger({
-  collapsed: false, // auto-expand logged mutations
-  filter (mutation, stateBefore, stateAfter) {
-    // retourne `true` si une mutation devrait être logguée
-    // `mutation` est un `{ type, payload }`
-    return mutation.type !== "aBlacklistedMutation"
-  },
-  transformer (state) {
-    // transforme l'état avant de le logguer.
-    // retourne par exemple seulement un sous-arbre spécifique
-    return state.subTree
-  },
-  mutationTransformer (mutation) {
-    // les mutations sont logguées au format `{ type, payload }`
-    // nous pouvons les formater comme nous le souhaitons.
-    return mutation.type
-  },
-  logger: console, // implementation de l'API `console`, par défaut `console`
-})
-```
-
-Le fichier de logs peut aussi être inclus directement via une balise `script`, et exposera la fonction `createVuexLogger` globalement.
-
-Notez que le plugin de logs peut prendre des instantanés de l'état, ne l'utilisez donc que durant le développement.

+ 0 - 109
docs-gitbook/fr/state.md

@@ -1,109 +0,0 @@
-# State
-
-### Arbre d'état unique
-
-Vuex utilise un **arbre d'état unique**, c'est-à-dire que cet unique objet contient tout l'état au niveau applicatif et sert de « source de vérité unique ». Cela signifie également que vous n'aurez qu'un seul store pour chaque application. Un arbre d'état unique rend rapide la localisation d'une partie spécifique de l'état et permet de facilement prendre des instantanés de l'état actuel de l'application à des fins de débogage.
-
-L'arbre d'état unique n'entre pas en conflit avec la modularité. Dans les prochains chapitres, nous examinerons comment séparer votre état et vos mutations dans des sous-modules.
-
-### Récupération d'état Vuex dans des composants Vue
-
-Alors, comment affichons-nous l'état du store dans nos composants Vue ? Puisque les stores Vuex sont réactifs, la façon la plus simple d'y « récupérer » l'état est tout simplement de retourner une partie de l'état depuis une [une propriété calculée](https://fr.vuejs.org/guide/computed.html) :
-
-``` js
-// créons un composant Counter
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return store.state.count
-    }
-  }
-}
-```
-
-Lorsque `store.state.count` change, cela entrainera la réévaluation de la propriété calculée, et déclenchera les actions associées au DOM.
-
-Cependant, ce modèle oblige le composant à compter sur le singleton global du store. Lorsqu'on utilise un système de module, il est nécessaire d'importer le store dans tous les composants qui utilisent l'état du store, et il est également nécessaire de le simuler lorsque l'on teste le composant.
-
-Vuex fournit un mécanisme pour « injecter » le store dans tous les composants enfants du composant racine avec l'option `store` (activée par `Vue.use(Vuex)`) :
-
-``` js
-const app = new Vue({
-  el: '#app',
-  // fournit le store avec l'option `store`.
-  // cela injectera l'instance du store dans tous les composants enfants.
-  store,
-  components: { Counter },
-  template: `
-    <div class="app">
-      <counter></counter>
-    </div>
-  `
-})
-```
-
-En fournissant l'option `store` à l'instance racine, le store sera injecté dans tous les composants enfants de la racine et sera disponible dans ces derniers avec `this.$store`. Mettons à jour notre implémentation de `Counter` :
-
-``` js
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return this.$store.state.count
-    }
-  }
-}
-```
-
-### La fonction utilitaire `mapState`
-
-Lorsqu'un composant a besoin d'utiliser plusieurs accesseurs ou propriétés de l'état du store, déclarer toutes ces propriétés calculées peut devenir répétitif et verbeux. Afin de pallier à ça, nous pouvons utiliser la fonction utilitaire `mapState` qui génère des fonctions d'accession pour nous et nous épargne quelques coups de clavier :
-
-``` js
-// dans la version complète, des fonctions utilitaires sont exposées telles que `Vuex.mapState`
-import { mapState } from 'vuex'
-
-export default {
-  // ...
-  computed: mapState({
-    // les fonctions fléchées peuvent rendre le code très succinct !
-    count: state => state.count,
-
-    // passer la valeur littérale 'count' revient à écrire `state => state.count`
-    countAlias: 'count',
-
-    // pour accéder à l'état local avec `this`, une fonction normale doit être utilisée
-    countPlusLocalState (state) {
-      return state.count + this.localCount
-    }
-  })
-}
-```
-
-Il est également possible de fournir un tableau de chaines de caractères à `mapState` lorsque le nom de la propriété calculée associée est le même que le nom de l'état du store.
-
-``` js
-computed: mapState([
-  // attacher `this.count` à `store.state.count`
-  'count'
-])
-```
-
-### Opérateur de décomposition
-
-Notez que `mapState` renvoie un objet. Comment l'utiliser en complément des autres propriétés calculées locales ? Normalement, il faudrait utiliser un outil pour fusionner les multiples objets en un seul afin de passer cet objet final à `computed`. Cependant avec l'[opérateur de décomposition](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateur_de_d%C3%A9composition) (qui est une proposition stage-3 ECMASCript), nous pouvons grandement simplifier la syntaxe :
-
-``` js
-computed: {
-  localComputed () { /* ... */ },
-  // rajouter cet objet dans l'objet `computed` avec l'opérateur de décomposition
-  ...mapState({
-    // ...
-  })
-}
-```
-
-### Les composants peuvent toujours avoir un état local
-
-Utiliser Vuex ne signifie pas que vous devez mettre **tout** votre état dans Vuex. Bien que le fait de mettre plus d'états dans Vuex rende vos mutations d'état plus explicites et plus débogable, parfois il peut aussi rendre le code plus verbeux et indirect. Si une partie de l'état appartient directement à un seul composant, il est parfaitement sain de la laisser dans l'état local. Assurez-vous de prendre en compte les avantages et inconvénients d'une telle décision afin de vous adapter au mieux aux besoins de votre application.

+ 0 - 25
docs-gitbook/fr/strict.md

@@ -1,25 +0,0 @@
-# Mode strict
-
-Pour activer le mode strict, passez simplement l'option `strict: true` pendant la création d'un store Vuex :
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: true
-})
-```
-
-En mode strict, lorsque l'état de Vuex est modifié en dehors des gestionnaires de mutation, une erreur sera lancée. Cela permet de s'assurer que toutes les mutations de l'état peuvent être explicitement tracées par les outils de débogage.
-
-### Développement vs. production
-
-**N'activez pas le mode strict lorsque vous déployez en production !** Le mode strict lance une observation récursive de l'arbre d'état pour détecter des mutations inappropriées. Assurez-vous de l'avoir désactivé en production pour éviter un cout sur les performances.
-
-Tout comme les plugins, nous pouvons laisser nos outils de build gérer ça :
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: process.env.NODE_ENV !== 'production'
-})
-```

+ 0 - 32
docs-gitbook/fr/structure.md

@@ -1,32 +0,0 @@
-# Structure d'une application
-
-Vuex ne vous restreint pas quand à la structure de code à utiliser. Il impose plutôt de respecter des principes de haut niveau :
-
-1. L'état de l'application est centralisé dans le store.
-
-2. La seule façon de muter l'état est d'acter des **mutations**, qui sont des transactions synchrones.
-
-3. La logique asynchrone doit être composée et encapsulée dans des **actions**.
-
-Tant que vous suivez ces règles, c'est à vous de structurer votre projet. Si votre fichier de store devient trop gros, commencez dès lors à séparer les actions, mutations et accesseurs dans des fichiers séparés.
-
-Pour une application non triviale, nous aurons probablement besoin de faire appel à des modules. Voici un exemple de structure de projet :
-
-``` bash
-├── index.html
-├── main.js
-├── api
-│   └── ... # abstraction pour faire des requêtes par API
-├── components
-│   ├── App.vue
-│   └── ...
-└── store
-    ├── index.js          # là où l'on assemble nos modules et exportons le store
-    ├── actions.js        # actions racine
-    ├── mutations.js      # mutations racine
-    └── modules
-        ├── cart.js       # module de panier
-        └── products.js   # module de produit
-```
-
-Vous pouvez jeter à un œil à l'[exemple de panier d'achats](https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart).

+ 0 - 222
docs-gitbook/fr/testing.md

@@ -1,222 +0,0 @@
-# Tests
-
-Les parties principales que l'on veut couvrir par des tests unitaires avec Vuex sont les mutations et les actions.
-
-### Tester les mutations
-
-Les mutations sont très simples à tester, puisque ce sont de simples fonctions qui se basent uniquement sur leurs arguments. Une astuce est que si vous utilisez les modules ES2015 et mettez vos mutations dans votre fichier `store.js`, en plus de l'export par défaut, vous pouvez également exporter vos mutations avec un export nommé :
-
-``` js
-const state = { ... }
-
-// exporter `mutations` en tant qu'export nommé
-export const mutations = { ... }
-
-export default new Vuex.Store({
-  state,
-  mutations
-})
-```
-
-Exemple de test de mutation utilisant Mocha + Chai (vous pouvez utiliser n'importe quel framework/bibliothèque d'assertion selon vos préférences) :
-
-``` js
-// mutations.js
-export const mutations = {
-  increment: state => state.count++
-}
-```
-
-``` js
-// mutations.spec.js
-import { expect } from 'chai'
-import { mutations } from './store'
-
-// assignement de `mutations` par déstructuration
-const { increment } = mutations
-
-describe('mutations', () => {
-  it('INCREMENT', () => {
-    // état simulé
-    const state = { count: 0 }
-    // appliquer la mutation
-    increment(state)
-    // tester le résultat
-    expect(state.count).to.equal(1)
-  })
-})
-```
-
-### Tester les actions
-
-Les actions sont un peu plus compliquées car elles peuvent faire appel à des APIs externes. Lorsque l'on teste des actions, on a souvent besoin de faire plusieurs niveaux de simulation. Par exemple, on peut abstraire l'appel API dans un service et simuler ce service dans nos tests. Afin de simuler facilement les dépendances, on peut utiliser webpack et [inject-loader](https://github.com/plasticine/inject-loader) pour regrouper nos fichiers de test.
-
-Exemple de test d'une action asynchrone :
-
-``` js
-// actions.js
-import shop from '../api/shop'
-
-export const getAllProducts = ({ commit }) => {
-  commit('REQUEST_PRODUCTS')
-  shop.getProducts(products => {
-    commit('RECEIVE_PRODUCTS', products)
-  })
-}
-```
-
-``` js
-// actions.spec.js
-
-// utilisation de la syntaxe `require` pour les loaders.
-// avec inject-loader, cela retourne un module de fabrique
-// cela nous permet d'injecter les dépendances simulées.
-import { expect } from 'chai'
-const actionsInjector = require('inject-loader!./actions')
-
-// créer un module avec nos simulations
-const actions = actionsInjector({
-  '../api/shop': {
-    getProducts (cb) {
-      setTimeout(() => {
-        cb([ /* réponse simulée */ ])
-      }, 100)
-    }
-  }
-})
-
-// fonction utilitaire pour tester des actions avec les mutations attendues
-const testAction = (action, args, state, expectedMutations, done) => {
-  let count = 0
-
-  // acter une simulation
-  const commit = (type, payload) => {
-    const mutation = expectedMutations[count]
-
-    try {
-      expect(type).to.equal(mutation.type)
-      if (payload) {
-        expect(payload).to.deep.equal(mutation.payload)
-      }
-    } catch (error) {
-      done(error)
-    }
-
-    count++
-    if (count >= expectedMutations.length) {
-      done()
-    }
-  }
-
-  // appeler l'action avec le store simulé et les arguments
-  action({ commit, state }, ...args)
-
-  // vérifier qu'aucune mutation n'ait été propagée
-  if (expectedMutations.length === 0) {
-    expect(count).to.equal(0)
-    done()
-  }
-}
-
-describe('actions', () => {
-  it('getAllProducts', done => {
-    testAction(actions.getAllProducts, [], {}, [
-      { type: 'REQUEST_PRODUCTS' },
-      { type: 'RECEIVE_PRODUCTS', payload: { /* mocked response */ } }
-    ], done)
-  })
-})
-```
-
-### Tester les accesseurs
-
-Si vos accesseurs font des calculs compliqués, il peut être judicieux de les tester. Les accesseurs sont également très simples à tester, pour les mêmes raisons que les mutations.
-
-Exemple de test d'un accesseur :
-
-``` js
-// getters.js
-export const getters = {
-  filteredProducts (state, { filterCategory }) {
-    return state.products.filter(product => {
-      return product.category === filterCategory
-    })
-  }
-}
-```
-
-``` js
-// getters.spec.js
-import { expect } from 'chai'
-import { getters } from './getters'
-
-describe('getters', () => {
-  it('filteredProducts', () => {
-    // état simulé
-    const state = {
-      products: [
-        { id: 1, title: 'Apple', category: 'fruit' },
-        { id: 2, title: 'Orange', category: 'fruit' },
-        { id: 3, title: 'Carrot', category: 'vegetable' }
-      ]
-    }
-    // accesseur simulé
-    const filterCategory = 'fruit'
-
-    // obtenir le résultat depuis l'accesseur
-    const result = getters.filteredProducts(state, { filterCategory })
-
-    // tester le résultat
-    expect(result).to.deep.equal([
-      { id: 1, title: 'Apple', category: 'fruit' },
-      { id: 2, title: 'Orange', category: 'fruit' }
-    ])
-  })
-})
-```
-
-### Lancer les tests
-
-Si vos mutations et actions sont écrites comme il se doit, les tests ne devraient pas avoir de dépendance directe sur les APIs navigateur après une simulation préalable. Cela signifie que vous pouvez simplement regrouper les tests avec webpack et les lancer directement dans Node.js. De façon alternative, vous pouvez utiliser `mocha-loader` ou Karma + `karma-webpack` afin d'effectuer les tests dans des vrais navigateurs.
-
-#### Lancer dans Node.js
-
-Créez la configuration webpack suivante (ainsi que le fichier [`.babelrc`](https://babeljs.io/docs/usage/babelrc/) qui correspond) :
-
-``` js
-// webpack.config.js
-module.exports = {
-  entry: './test.js',
-  output: {
-    path: __dirname,
-    filename: 'test-bundle.js'
-  },
-  module: {
-    loaders: [
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/
-      }
-    ]
-  }
-}
-```
-
-Puis :
-
-``` bash
-webpack
-mocha test-bundle.js
-```
-
-#### Lancer dans un navigateur
-
-1. Installez `mocha-loader`.
-2. Changez l'option `entry` de la configuration webpack ci-dessus pour `'mocha-loader!babel-loader!./test.js'`.
-3. Démarrez `webpack-dev-server` en utilisant la configuration.
-4. Rendez-vous avec votre navigateur sur `localhost:8080/webpack-dev-server/test-bundle`.
-
-#### Lancer dans un navigateur avec Karma + karma-webpack
-
-Consultez la procédure sur la [documentation vue-loader](https://vue-loader.vuejs.org/en/workflow/testing.html).

binární
docs-gitbook/gitbook/images/favicon.ico


+ 0 - 1
docs-gitbook/ja/README.md

@@ -1 +0,0 @@
-{% include "./SUMMARY.md" %}

+ 0 - 21
docs-gitbook/ja/SUMMARY.md

@@ -1,21 +0,0 @@
-# Vuex
-
-> 注意: TypeScript ユーザ向けは、vuex@3.0+ と vue@2.5+ が必須、逆もまた同様です。
-
-- [リリースノート](https://github.com/vuejs/vuex/releases)
-- [インストール](installation.md)
-- [Vuex とは何か?](intro.md)
-- [Vuex 入門](getting-started.md)
-- [コアコンセプト](core-concepts.md)
-  - [ステート](state.md)
-  - [ゲッター](getters.md)
-  - [ミューテーション](mutations.md)
-  - [アクション](actions.md)
-  - [モジュール](modules.md)
-- [アプリケーションの構造](structure.md)
-- [プラグイン](plugins.md)
-- [厳格モード](strict.md)
-- [フォームの扱い](forms.md)
-- [テスト](testing.md)
-- [ホットリローディング](hot-reload.md)
-- [API リファレンス](api.md)

+ 0 - 176
docs-gitbook/ja/actions.md

@@ -1,176 +0,0 @@
-# アクション
-
-アクションはミューテーションと似ていますが、下記の点で異なります:
-
-- アクションは、状態を変更するのではなく、ミューテーションをコミットします。
-- アクションは任意の非同期処理を含むことができます。
-
-シンプルなアクションを登録してみましょう:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  },
-  actions: {
-    increment (context) {
-      context.commit('increment')
-    }
-  }
-})
-```
-
-アクションハンドラはストアインスタンスのメソッドやプロパティのセットと同じものを呼び出せるコンテキストオブジェクトを受け取ります。したがって `context.commit` を呼び出すことでミューテーションをコミットできます。あるいは `context.state` や `context.getters` で、状態やゲッターにアクセスできます。なぜコンテキストオブジェクトがストアインスタンスそのものではないのかは、後ほど[モジュール](modules.md)で説明します。
-
-実際にはコードを少しシンプルにするために ES2015 の[引数分割束縛(argument destructuring)](https://github.com/lukehoban/es6features#destructuring)がよく使われます(特に `commit` を複数回呼び出す必要があるとき):
-
-``` js
-actions: {
-  increment ({ commit }) {
-    commit('increment')
-  }
-}
-```
-
-### アクションのディスパッチ
-
-アクションは `store.dispatch` がトリガーとなって実行されます:
-
-``` js
-store.dispatch('increment')
-```
-
-これは一見ばかげて見えるかもしれません。つまり、カウントをインクリメントしたいときに、どうして直接 `store.commit('increment')` を呼び出してミューテーションをコミットしないのか、と。**ミューテーションは同期的でなければならない**というのを覚えていますか?アクションはそうではありません。アクションの中では**非同期**の操作を行うことができます。
-
-``` js
-actions: {
-  incrementAsync ({ commit }) {
-    setTimeout(() => {
-      commit('increment')
-    }, 1000)
-  }
-}
-```
-
-アクションはペイロード形式とオブジェクトスタイルのディスパッチをサポートします:
-
-``` js
-// ペイロードを使ってディスパッチする
-store.dispatch('incrementAsync', {
-  amount: 10
-})
-
-// オブジェクトを使ってディスパッチする
-store.dispatch({
-  type: 'incrementAsync',
-  amount: 10
-})
-```
-
-より実践的な例として、ショッピングカートをチェックアウトするアクションを挙げます。このアクションは**非同期な API の呼び出し**と、**複数のミューテーションのコミット**をします:
-
-``` js
-actions: {
-  checkout ({ commit, state }, products) {
-    // 現在のカート内の商品を保存する
-    const savedCartItems = [...state.cart.added]
-    // チェックアウトのリクエストを送信し、楽観的にカート内をクリアする
-    commit(types.CHECKOUT_REQUEST)
-    // shop API は成功時のコールバックと失敗時のコールバックを受け取る
-    shop.buyProducts(
-      products,
-      // 成功時の処理
-      () => commit(types.CHECKOUT_SUCCESS),
-      // 失敗時の処理
-      () => commit(types.CHECKOUT_FAILURE, savedCartItems)
-    )
-  }
-}
-```
-
-一連の非同期の処理を実行しつつ、ミューテーションのコミットによってのみ副作用(状態の変更)を与えていることに注意してください。
-
-### コンポーネント内でのアクションのディスパッチ
-
-`this.$store.dispatch('xxx')` でコンポーネント内でアクションをディスパッチできます。あるいはコンポーネントのメソッドを `store.dispatch` にマッピングする `mapActions` ヘルパーを使うこともできます(ルートの `store` の注入が必要です):
-
-``` js
-import { mapActions } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapActions([
-      'increment', // `this.increment()` を `this.$store.dispatch('increment')` にマッピングする
-      // `mapActions` もペイロードをサポートする:
-      'incrementBy' // `this.incrementBy(amount)` を `this.$store.dispatch('incrementBy', amount)` にマッピングする
-    ]),
-    ...mapActions({
-      add: 'increment' // `this.add()` を `this.$store.dispatch('increment')` にマッピングする
-    })
-  }
-}
-```
-
-### アクションを構成する
-
-アクションはしばしば非同期処理を行いますが、アクションが完了したことをどうやって知れば良いのでしょう?そしてもっと重要なことは、さらに複雑な非同期処理を取り扱うために、どうやって複数のアクションを構成させるかということです。
-
-まず知っておくべきことは `store.dispatch` がトリガーされたアクションハンドラによって返された Promise を処理できることと、`store.dispatch` もまた Promise を返すことです。
-
-``` js
-actions: {
-  actionA ({ commit }) {
-    return new Promise((resolve, reject) => {
-      setTimeout(() => {
-        commit('someMutation')
-        resolve()
-      }, 1000)
-    })
-  }
-}
-```
-
-すると次のようにできます:
-
-``` js
-store.dispatch('actionA').then(() => {
-  // ...
-})
-```
-
-また別のアクションで下記のように書くと:
-
-``` js
-actions: {
-  // ...
-  actionB ({ dispatch, commit }) {
-    return dispatch('actionA').then(() => {
-      commit('someOtherMutation')
-    })
-  }
-}
-```
-
-最終的に [async / await](https://tc39.github.io/ecmascript-asyncawait/) を使用することで、次のようにアクションを組み合わせることができます:
-
-``` js
-// `getData()` と `getOtherData()` が Promise を返すことを想定している
-
-actions: {
-  async actionA ({ commit }) {
-    commit('gotData', await getData())
-  },
-  async actionB ({ dispatch, commit }) {
-    await dispatch('actionA') // `actionA` が完了するのを待機する
-    commit('gotOtherData', await getOtherData())
-  }
-}
-```
-
-> `store.dispatch` で異なるモジュール内の複数のアクションハンドラをトリガーすることができます。そのようなケースでは、全てのトリガーされたハンドラが解決されたときに解決する Promise が戻り値として返ってくることになります。

+ 0 - 221
docs-gitbook/ja/api.md

@@ -1,221 +0,0 @@
-# API リファレンス
-
-### Vuex.Store
-
-``` js
-import Vuex from 'vuex'
-
-const store = new Vuex.Store({ ...options })
-  ```
-
-### Vuex.Store コンストラクタオプション
-
-- **state**
-
-  - 型: `Object | Function`
-
-    ストアのための ルートステートオブジェクトです。[詳細](state.md)
-
-    オブジェクトを返す関数を渡す場合、返されたオブジェクトはルートステートとして使用されます。これは特にモジュールの再利用のためにステートオブジェクトを再利用する場合に便利です。[詳細](modules.md#モジュールの再利用)
-
-- **mutations**
-
-  - 型: `{ [type: string]: Function }`
-
-    ストアにミューテーションを登録します。ハンドラ関数は第一引数に `state` を常に受け取り(モジュール内で定義されていれば、モジュールのローカルステートを受け取り)、指定されていれば第二引数に `payload` を受け取ります。
-
-    [詳細](mutations.md)
-
-- **actions**
-
-  - 型: `{ [type: string]: Function }`
-
-    ストアにアクションを登録します。ハンドラ関数は次のプロパティを持つ `context` オブジェクトを受け取ります。:
-
-    ``` js
-    {
-      state,      // `store.state` と同じか、モジュール内にあればローカルステート
-      rootState,  // `store.state` と同じ。ただしモジュール内に限る
-      commit,     // `store.commit` と同じ
-      dispatch,   // `store.dispatch` と同じ
-      getters,    // `store.getters` と同じか、モジュール内にあればローカルゲッター
-      rootGetters // `store.getters` と同じ。ただしモジュール内に限る
-    }
-    ```
-
-    そして、第 2 引数の `payload` があれば、それを受け取ります。
-
-    [詳細](actions.md)
-
-- **getters**
-
-  - type: `{ [key: string]: Function }`
-
-    ストアにゲッターを登録します. ゲッター関数は次の引数を受け取ります:
-
-    ```
-    state,     // モジュール内で定義されていればモジュールのローカルステート
-    getters    // store.getters と同じ
-    ```
-
-    モジュールで定義されたときの仕様
-    
-    ```
-    state,       // モジュールで定義された場合、モジュールのローカルステート
-    getters,     // 現在のモジュールのモジュールのローカルゲッター
-    rootState,   // グローバルステート
-    rootGetters  // 全てのゲッター
-    ```
-
-    登録されたゲッターは `store.getters` 上に公開されます。
-
-    [詳細](getters.md)
-
-- **modules**
-
-  - 型: `Object`
-
-    サブモジュールを含む次のような形式のオブジェクトはストアにマージされます。
-
-    ``` js
-    {
-      key: {
-        state,
-        mutations
-        actions?,
-        getters?,
-        modules?
-    
-      },
-      ...
-    }
-    ```
-
-    各モジュールは、ルートオプションに似た `state` と `mutations` を含むことができます。モジュールの状態は、モジュールのキーを使って、ストアのルートステートに結合されます。モジュールのミューテーションとゲッターは、第一引数としてルートステートの代わりに、モジュールのローカルステートだけを受け取り、モジュールのアクションの `context.state` もローカルステートを指すようになります。
-
-    [詳細](modules.md)
-
-- **plugins**
-
-  - 型: `Array<Function>`
-
-    プラグイン関数の配列は、ストアに適用されます。このプラグインは、ストアだけを引数として受け取り、外部への永続化、ロギング、デバッギングのために、ミューテーションを監視するか、または、 websocket や observable のような外から渡されるデータのためにミューテーションをディスパッチします。
-
-    [詳細](plugins.md)
-
-- **strict**
-
-  - 型: `Boolean`
-  - デフォルト: `false`
-
-    Vuex ストアを厳格モードにします。厳格モードでは、ミューテーションハンドラ以外で、 Vuex の状態の変更を行うと、エラーが投げられます。
-
-    [詳細](strict.md)
-
-### Vuex.Store インスタンスプロパティ
-
-- **state**
-
-  - type: `Object`
-
-    ルートステート、読み取り専用です。
-
-- **getters**
-
-  - type: `Object`
-
-    登録されているゲッターを公開します。読み取り専用です。
-
-### Vuex.Store インスタンスメソッド
-
-- **`commit(type: string, payload?: any, options?: Object)`**
-- **`commit(mutation: Object, options?: Object)`**
-
-  ミューテーションをコミットします。`options` は[名前空間付きモジュール](modules.md#名前空間)で root なミューテーションにコミットできる `root: true` を持つことできます。[詳細](mutations.md)
-
-- **`dispatch(type: string, payload?: any, options?: Object)`**
-- **`dispatch(action: Object, options?: Object)`**
-
-  アクションをディスパッチします。`options` は[名前空間付きモジュール](modules.md#名前空間)で root なアクションにディスパッチできる `root: true` を持つことできます。 すべてのトリガーされたアクションハンドラを解決するPromiseを返します。[詳細](actions.md)
-
-- **`replaceState(state: Object)`**
-
-  ストアのルートステートを置き換えます。これは、ステートのハイドレーションやタイムトラベルのためだけに利用すべきです。
-
-- **`watch(getter: Function, cb: Function, options?: Object)`**
-
-  リアクティブにゲッター関数の返す値を監視します。値が変わった場合は、コールバックを呼びます。ゲッターはストアの `state` を最初の引数として、 `getters` を2番目の引数として受け取ります。 Vue の`vm.$watch`メソッドと同じオプションをオプションのオブジェクトとして受け付けます。
-
-  監視を止める場合は、ハンドラ関数の返り値を関数として呼び出します。
-
-- **`subscribe(handler: Function)`**
-
-  ストアへのミューテーションを購読します。`handler` は、全てのミューテーションの後に呼ばれ、引数として、ミューテーション ディスクリプタとミューテーション後の状態を受け取ります。
-
-  ``` js
-  store.subscribe((mutation, state) => {
-    console.log(mutation.type)
-    console.log(mutation.payload)
-  })
-  ```
-
-  プラグインの中でもっともよく利用されます。[詳細](plugins.md)
-
-- **`subscribeAction(handler: Function)`**
-
-  > 2.5.0 で新規追加
-
-  ストアアクションを購読します。`handler` はディスパッチされたアクションごとに呼び出され、アクション記述子と現在のストア状態を引数として受け取ります:
-
-  ``` js
-  store.subscribeAction((action, state) => {
-    console.log(action.type)
-    console.log(action.payload)
-  })
-  ```
-
- プラグインで最も一般的に使用されます。[Details](plugins.md)
-
-- **`registerModule(path: string | Array<string>, module: Module, options?: Object)`**
-
-  動的なモジュールを登録します。[詳細](modules.md#dynamic-module-registration)
-
-  `options` は前の状態を保存する `preserveState: true` を持つことができます。サーバサイドレンダリングに役立ちます。
-
-- **`unregisterModule(path: string | Array<string>)`**
-
-  動的なモジュールを解除します。[詳細](modules.md#dynamic-module-registration)
-
-- **`hotUpdate(newOptions: Object)`**
-
-  新しいアクションとミューテーションをホットスワップします。[詳細](hot-reload.md)
-
-### コンポーネントをバインドするヘルパー
-
-- **`mapState(namespace?: string, map: Array<string> | Object): Object`**
-
-  ストアのサブツリーを返すコンポーネントの computed オプションを作成します。[詳細](state.md#the-mapstate-helper)
-
-  第1引数は、オプションで名前空間文字列にすることができます。[詳細](modules.md#binding-helpers-with-namespace)
-
-- **`mapGetters(namespace?: string, map: Array<string> | Object): Object`**
-
-  ゲッターの評価後の値を返すコンポーネントの computed オプションを作成します。[詳細](getters.md#the-mapgetters-helper)
-
-  第1引数は、オプションで名前空間文字列にすることができます。[詳細](modules.md#binding-helpers-with-namespace)
-
-- **`mapActions(namespace?: string, map: Array<string> | Object): Object`**
-
-  アクションをディスパッチするコンポーネントの methods オプションを作成します。[詳細](actions.md#dispatching-actions-in-components)
-
-  第1引数は、オプションで名前空間文字列にすることができます。[詳細](modules.md#binding-helpers-with-namespace)
-
-- **`mapMutations(namespace?: string, map: Array<string> | Object): Object`**
-
-  ミューテーションをコミットするコンポーネントの methods オプションを作成します。[詳細](mutations.md#commiting-mutations-in-components)
-
-  第1引数は、オプションで名前空間文字列にすることができます。[詳細](modules.md#binding-helpers-with-namespace)
-
-- **`createNamespacedHelpers(namespace: string): Object`**
-
-  名前空間付けられたコンポーネントバインディングのヘルパーを作成します。返されるオブジェクトは指定された名前空間にバインドされた `mapState`、`mapGetters`、`mapActions` そして `mapMutations` が含まれます。[詳細はこちら](modules.md#binding-helpers-with-namespace)

+ 0 - 19
docs-gitbook/ja/book.json

@@ -1,19 +0,0 @@
-{
-  "gitbook": "2.x.x",
-  "plugins": ["edit-link", "prism", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Edit This Page"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 12
docs-gitbook/ja/core-concepts.md

@@ -1,12 +0,0 @@
-# コアコンセプト
-
-この章では、Vuex のコアコンセプトについて、以下を学習します。
-  - [ステート](state.md)
-  - [ゲッター](getters.md)
-  - [ミューテーション](mutations.md)
-  - [アクション](actions.md)
-  - [モジュール](modules.md)
-
-これらのコンセプトを深く理解することは、Vuex を使用するにあたって不可欠です。
-
-それでは、始めましょう!

+ 0 - 59
docs-gitbook/ja/forms.md

@@ -1,59 +0,0 @@
-# フォームの扱い
-
-厳格モードで Vuex を使用するとき、Vuex に属する状態の一部で `v-model` を使用するのは少しトリッキーです:
-
-``` html
-<input v-model="obj.message">
-```
-
-`obj` がストアからオブジェクトを返す算出プロパティ (computed property) と仮定すると、`v-model` は input でユーザーが入力するとき、直接 `obj.message` を変更します。厳格モードでは、この変更は明示的に Vuex のミューテーションハンドラ内部で処理されていないため、エラーを投げます。
-
-それに対処するための "Vuex way" は、`<input>` の値をバインディングし、`input` または `change` イベントでアクションを呼び出すことです:
-
-``` html
-<input :value="message" @input="updateMessage">
-```
-``` js
-// ...
-computed: {
-  ...mapState({
-    message: state => state.obj.message
-  })
-},
-methods: {
-  updateMessage (e) {
-    this.$store.commit('updateMessage', e.target.value)
-  }
-}
-```
-
-ミューテーションのハンドラは以下のようになります:
-
-``` js
-// ...
-mutations: {
-  updateMessage (state, message) {
-    state.obj.message = message
-  }
-}
-```
-
-### 双方向算出プロパティ
-
-確かに、上記の例は単純な `v-model` と ローカルステートよりもかなり冗長で、`v-model` のいくつかの有用な機能が使えません。代わりに、セッターで双方向算出プロパティを使うアプローチがあります。
-
-``` html
-<input v-model="message">
-```
-``` js
-computed: {
-  message: {
-    get () {
-      return this.$store.state.obj.message
-    },
-    set (value) {
-      this.$store.commit('updateMessage', value)
-    }
-  }
-}
-```

+ 0 - 115
docs-gitbook/ja/getters.md

@@ -1,115 +0,0 @@
-# ゲッター
-
-例えば項目のリストをフィルタリングしたりカウントするときのように、ストアの状態を算出したいときがあります。
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.state.todos.filter(todo => todo.done).length
-  }
-}
-```
-
-もしこの関数を複数のコンポーネントで利用したくなったら、関数をコピーするか、あるいは関数を共用のヘルパーに切り出して複数の場所でインポートする必要があります。しかし、どちらも理想的とはいえません。
-
-Vuex を利用するとストア内に "ゲッター" を定義することができます。それらをストアの算出プロパティと考えることができます。算出プロパティと同様に、ゲッターの結果はその依存関係に基づいて計算され、依存関係の一部が変更されたときにのみ再評価されます。
-
-ゲッターは第1引数として、state を受け取ります:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    todos: [
-      { id: 1, text: '...', done: true },
-      { id: 2, text: '...', done: false }
-    ]
-  },
-  getters: {
-    doneTodos: state => {
-      return state.todos.filter(todo => todo.done)
-    }
-  }
-})
-```
-
-### プロパティスタイルアクセス
-
-ゲッターは `store.getters` オブジェクトから取り出され、プロパティとしてアクセスすることができます:
-
-``` js
-store.getters.doneTodos // -> [{ id: 1, text: '...', done: true }]
-```
-
-ゲッターは第2引数として他のゲッターを受け取ります:
-
-``` js
-getters: {
-  // ...
-  doneTodosCount: (state, getters) => {
-    return getters.doneTodos.length
-  }
-}
-```
-
-``` js
-store.getters.doneTodosCount // -> 1
-```
-
-どのコンポーネントの内部でも簡単にゲッターを利用することができます:
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.getters.doneTodosCount
-  }
-}
-```
-
-プロパティとしてアクセスされるゲッターは Vue のリアクティブシステムの一部としてキャッシュされるという点に留意してください。
-
-### メソッドスタイルアクセス
-
-関数を返り値にすることで、ゲッターに引数を渡すこともできます。これは特にストアの中の配列を検索する時に役立ちます:
-```js
-getters: {
-  // ...
-  getTodoById: (state) => (id) => {
-    return state.todos.find(todo => todo.id === id)
-  }
-}
-```
-
-``` js
-store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }
-```
-
-メソッドによってアクセスされるゲッターは呼び出す度に実行され、その結果はキャッシュされない点に留意してください。
-
-### `mapGetters` ヘルパー
-
-`mapGetters` ヘルパーはストアのゲッターをローカルの算出プロパティにマッピングさせます:
-
-``` js
-import { mapGetters } from 'vuex'
-
-export default {
-  // ...
-  computed: {
-    // ゲッターを、スプレッド演算子(object spread operator)を使って computed に組み込む
-    ...mapGetters([
-      'doneTodosCount',
-      'anotherGetter',
-      // ...
-    ])
-  }
-}
-```
-
-ゲッターを異なる名前でマッピングさせたいときはオブジェクトを使います:
-
-``` js
-...mapGetters({
-  // `this.doneCount` を `store.getters.doneTodosCount` にマッピングさせる
-  doneCount: 'doneTodosCount'
-})
-```

+ 0 - 44
docs-gitbook/ja/getting-started.md

@@ -1,44 +0,0 @@
-# Vuex 入門
-
-Vuex アプリケーションの中心にあるものは**ストア**です。"ストア" は、基本的にアプリケーションの**状態(state)**を保持するコンテナです。単純なグローバルオブジェクトとの違いが 2つあります。
-
-1. Vuex ストアはリアクティブです。Vue コンポーネントがストアから状態を取り出すとき、もしストアの状態が変化したら、ストアはリアクティブかつ効率的に更新を行います。
-
-2. ストアの状態を直接変更することはできません。明示的に**ミューテーションをコミットする**ことによってのみ、ストアの状態を変更します。これによって、全ての状態の変更について追跡可能な記録を残すことが保証され、ツールでのアプリケーションの動作の理解を助けます。
-
-### シンプルなストア
-
-> **注意:** 私たちは、このドキュメントのコード例に ES2015 のシンタックスを利用しています。 もし触れたことがなければ、[ぜひ触れてください](https://babeljs.io/docs/learn-es2015/)!
-
-Vuex を[インストール](installation.md) してから、ストアをつくってみましょう。Vuex ストアの作成は、とても簡単です。ストアオブジェクトの初期状態と、いくつかのミューテーションを準備するだけです。
-
-``` js
-// モジュールシステムを利用しているときはあらかじめ Vue.use(Vuex) を呼び出していることを確認しておいてください
-
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  }
-})
-```
-
-これで `store.state` でストアオブジェクトの状態を参照でき、また `store.commit` メソッドで状態の変更を行うことができます。
-
-``` js
-store.commit('increment')
-
-console.log(store.state.count) // -> 1
-```
-
-そして `store.state.count` を直接変更する代わりにミューテーションをコミットする理由は、状態の変更を明確に追跡したいからです。このシンプルな規約は、あなたのコードの意図をさらに明確にし、コードを読んだ時にアプリケーションの状態の変更について、論理的に考えることができるようにします。加えて、私たちに全ての変更のログを取ったり、状態のスナップショットを取ったり、タイムトラベルデバッグを行うようなツールを実装する余地を与えてくれます。
-
-ストアオブジェクトの状態はリアクティブなので、ストアの状態をコンポーネント内で使うには算出プロパティ内でただ状態を返せば良いです。コンポーネントメソッドでミューテーションをコミットすることによって状態の変更を行います。
-
-こちらが [Vuex を使った最も基本的なカウンターアプリの例](https://jsfiddle.net/n9jmu5v7/1269/)です。
-
-これから Vuex のコアコンセプトについて詳しく説明していきます。まずは[状態(state)](state.md)からはじめましょう。

+ 0 - 44
docs-gitbook/ja/hot-reload.md

@@ -1,44 +0,0 @@
-# ホットリローディング
-
-Vuex は webpack の [Hot Module Replacement API](https://webpack.js.org/guides/hot-module-replacement/) を使用することで、アプリケーションの開発を行っている間のミューテーション、モジュール、アクション、ゲッターのホットリローディングをサポートします。Browserify では [browserify-hmr](https://github.com/AgentME/browserify-hmr/) プラグインを使用することができます。
-
-ミューテーションとモジュールのホットリローディングのために、`store.hotUpdate()`  API メソッドを利用する必要があります:
-
-``` js
-// store.js
-import Vue from 'vue'
-import Vuex from 'vuex'
-import mutations from './mutations'
-import moduleA from './modules/a'
-
-Vue.use(Vuex)
-
-const state = { ... }
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  modules: {
-    a: moduleA
-  }
-})
-
-if (module.hot) {
-  // ホットモジュールとしてアクションとモジュールを受け付けます
-  module.hot.accept(['./mutations', './modules/a'], () => {
-    // 更新されたモジュールをインポートする
-    // babel 6 のモジュール出力のため、ここでは .default を追加しなければならない
-    const newActions = require('./actions').default
-    const newMutations = require('./mutations').default
-    // 新しいアクションとミューテーションにスワップ
-    store.hotUpdate({
-      mutations: newMutations,
-      modules: {
-        a: newModuleA
-      }
-    })
-  })
-}
-```
-
-ホットリローディングを試したい場合は、[counter-hot example](https://github.com/vuejs/vuex/tree/dev/examples/counter-hot)をチェックアウトしてください。

+ 0 - 50
docs-gitbook/ja/installation.md

@@ -1,50 +0,0 @@
-# インストール
-
-### 直接ダウンロードする / CDN
-
-[https://unpkg.com/vuex](https://unpkg.com/vuex)
-
-<!--email_off-->
-[Unpkg.com](https://unpkg.com) で NPM ベースの CDN リンクが提供されています。上記リンクは常に NPM の最新のリリースを指します。`https://unpkg.com/vuex@2.0.0` のような URL によって特定のバージョン/タグを利用することもできます。
-<!--/email_off-->
-
-Vue のあとで `vuex` を取り込むと自動的に Vuex が導入されます:
-
-``` html
-<script src="/path/to/vue.js"></script>
-<script src="/path/to/vuex.js"></script>
-```
-
-### NPM
-
-``` bash
-npm install vuex --save
-```
-
-### Yarn
-
-``` bash
-yarn add vuex
-```
-
-モジュールシステムで利用される場合、 `Vue.use()` によって Vuex を明示的に導入する必要があります:
-
-``` js
-import Vue from 'vue'
-import Vuex from 'vuex'
-
-Vue.use(Vuex)
-```
-
-グローバルなスクリプトタグを利用する場合にはこのようにする必要はありません。
-
-### 開発版ビルド
-
-最新の開発版ビルドを利用したい場合には、 Github から直接クローンし `vuex` を自身でビルドする必要があります。
-
-``` bash
-git clone https://github.com/vuejs/vuex.git node_modules/vuex
-cd node_modules/vuex
-npm install
-npm run build
-```

+ 0 - 66
docs-gitbook/ja/intro.md

@@ -1,66 +0,0 @@
-# Vuex とは何か?
-
-Vuex は Vue.js アプリケーションのための **状態管理パターン + ライブラリ**です。
-これは予測可能な方法によってのみ状態の変異を行うというルールを保証し、アプリケーション内の全てのコンポーネントのための集中型のストアとして機能します。
-また Vue 公式の[開発ツール拡張](https://github.com/vuejs/vue-devtools)と連携し、設定なしでタイムトラベルデバッグやステートのスナップショットのエクスポートやインポートのような高度な機能を提供します。
-
-### "状態管理パターン"とはなんですか?
-
-単純な Vue で作られたカウンターアプリをみてみましょう:
-
-``` js
-new Vue({
-  // state
-  data () {
-    return {
-      count: 0
-    }
-  },
-  // view
-  template: `
-    <div>{{ count }}</div>
-  `,
-  // actions
-  methods: {
-    increment () {
-      this.count++
-    }
-  }
-})
-```
-
-これはいくつかの要素をアプリ自身に含んでいます:
-
-- **状態**、これは私達のアプリを動かす信頼できる情報源(the source of truth)です。
-- **ビュー**、これは**状態**のただの宣言的なマッピングです。
-- **アクション**、これは**ビュー**からのユーザー入力に反応して、状態の変更を可能にする方法です。
-
-これらは"単方向データフロー"のコンセプトの極めてシンプルな責務です:
-
-<p style="text-align: center; margin: 2em">
-  <img style="width:100%;max-width:450px;" src="./images/flow.png">
-</p>
-
-しかし、単純さは、**共通の状態を共有する複数のコンポーネントを持ったときに**、すぐに破綻します:
-
-- 複数のビューが同じ状態に依存することがあります。
-- 異なるビューからのアクションで、同じ状態を変更する必要があります。
-
-一つ目は、プロパティ (props) として深く入れ子になったコンポーネントに渡すのは面倒で、兄弟コンポーネントでは単純に機能しません。二つ目は、親子のインスタンスを直接参照したり、イベントを介して複数の状態のコピーを変更、同期することを試みるソリューションに頼っていることがよくあります。これらのパターンは、いずれも脆く、すぐにメンテナンスが困難なコードに繋がります。
-
-では、コンポーネントから共有している状態を抽出し、それをグローバルシングルトンで管理するのはどうでしょうか? これにより、コンポーネントツリーは大きな "ビュー" となり、どのコンポーネントもツリー内のどこにあっても状態にアクセスしたり、アクションをトリガーできます!
-
-さらに、状態管理に関わる概念を定義、分離し、特定のルールを敷くことで、コードの構造と保守性を向上させることができます。
-
-これが Vuex の背景にある基本的なアイディアであり、[Flux](https://facebook.github.io/flux/docs/overview)、 [Redux](http://redux.js.org/) そして [The Elm Architecture](https://guide.elm-lang.org/architecture/)から影響を受けています。
-他のパターンと異なるのは、Vuex は効率的な更新のために、Vue.js の粒度の細かいリアクティビティシステムを利用するよう特別に調整して実装されたライブラリだということです。
-
-![vuex](./images/vuex.png)
-
-### いつ、Vuexを使うべきでしょうか?
-
-Vuex は、共有状態の管理に役立ちますが、さらに概念やボイラープレートのコストがかかります。これは、短期的生産性と長期的生産性のトレードオフです。
-
-もし、あなたが大規模な SPA を構築することなく、Vuex を導入した場合、冗長で恐ろしいと感じるかもしれません。そう感じることは全く普通です。あなたのアプリがシンプルであれば、Vuex なしで問題ないでしょう。単純な [グローバルイベントバス](http://jp.vuejs.org/v2/guide/components.html#%E8%A6%AA%E5%AD%90%E9%96%93%E4%BB%A5%E5%A4%96%E3%81%AE%E9%80%9A%E4%BF%A1) が必要なだけかもしれません。しかし、中規模から大規模の SPA を構築する場合は、Vue コンポーネントの外の状態をどうやってうまく扱うか考える絶好の機会です。Vuex は自然な次のステップとなるでしょう。これは Redux の作者、Dan Abramov からの良い引用です:
-
-> Flux ライブラリは眼鏡のようなものです: それらが必要になったときに知るのです。

+ 0 - 294
docs-gitbook/ja/modules.md

@@ -1,294 +0,0 @@
-# モジュール
-
-単一ステートツリーを使うため、アプリケーションの全ての状態は、一つの大きなストアオブジェクトに内包されます。しかしながら、アプリケーションが大きくなるにつれて、ストアオブジェクトは膨れ上がってきます。
-
-そのような場合に役立てるため Vuex ではストアを**モジュール**に分割できるようになっています。それぞれのモジュールは、モジュール自身の状態(state)、ミューテーション、アクション、ゲッター、モジュールさえも内包できます(モジュールをネストできます)- トップからボトムまでフラクタル構造です:
-
-``` js
-const moduleA = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... },
-  getters: { ... }
-}
-
-const moduleB = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... }
-}
-
-const store = new Vuex.Store({
-  modules: {
-    a: moduleA,
-    b: moduleB
-  }
-})
-
-store.state.a // -> `moduleA` のステート
-store.state.b // -> `moduleB` のステート
-```
-
-### モジュールのローカルステート
-
-モジュールのミューテーションやゲッターの中では、渡される第1引数は**モジュールのローカルステート**です。
-
-``` js
-const moduleA = {
-  state: { count: 0 },
-  mutations: {
-    increment (state) {
-      // `state` はモジュールのローカルステート
-      state.count++
-    }
-  },
-
-  getters: {
-    doubleCount (state) {
-      return state.count * 2
-    }
-  }
-}
-```
-
-同様に、モジュールのアクションの中では `context.state` はローカルステートにアクセスでき、ルートのステートは `context.rootState` でアクセスできます:
-
-``` js
-const moduleA = {
-  // ...
-  actions: {
-    incrementIfOddOnRootSum ({ state, commit, rootState }) {
-      if ((state.count + rootState.count) % 2 === 1) {
-        commit('increment')
-      }
-    }
-  }
-}
-```
-
-また、モジュールのゲッターの中では、ルートのステートは第3引数でアクセスできます:
-
-``` js
-const moduleA = {
-  // ...
-  getters: {
-    sumWithRootCount (state, getters, rootState) {
-      return state.count + rootState.count
-    }
-  }
-}
-```
-
-### 名前空間
-
-デフォルトでは、アクション、ミューテーション、そしてゲッター内部のモジュールは**グローバル名前空間**の元で登録されます - これにより、複数のモジュールが同じミューテーション/アクションタイプに反応することができます。
-
-モジュールをより自己完結型にまた再利用可能なものにしたい場合は、それを `namespaced: true` によって名前空間に分けることができます。モジュールが登録されると、そのゲッター、アクション、およびミューテーションのすべてが、モジュールが登録されているパスに基づいて自動的に名前空間に入れられます。例えば:
-
-``` js
-const store = new Vuex.Store({
-  modules: {
-    account: {
-      namespaced: true,
-
-      // モジュールのアセット
-      state: { ... }, // モジュールステートはすでにネストされており、名前空間のオプションによって影響を受けません
-      getters: {
-        isAdmin () { ... } // -> getters['account/isAdmin']
-      },
-      actions: {
-        login () { ... } // -> dispatch('account/login')
-      },
-      mutations: {
-        login () { ... } // -> commit('account/login')
-      },
-
-      // ネストされたモジュール
-      modules: {
-        // 親モジュールから名前空間を継承する
-        myPage: {
-          state: { ... },
-          getters: {
-            profile () { ... } // -> getters['account/profile']
-          }
-        },
-
-        // さらに名前空間をネストする
-        posts: {
-          namespaced: true,
-
-          state: { ... },
-          getters: {
-            popular () { ... } // -> getters['account/posts/popular']
-          }
-        }
-      }
-    }
-  }
-})
-```
-
-名前空間のゲッターとアクションは、ローカライズされた `getters`、`dispatch`、`commit` を受け取ります。言い換えれば、同じモジュールに接頭辞 (prefix) を書き込まずに、モジュールアセットを使用することができます。名前空間オプションの切り替えは、モジュール内のコードには影響しません。
-
-#### 名前空間付きモジュールでのグローバルアセットへのアクセス
-
-グローバルステートとゲッターを使いたい場合、`rootState` と `rootGetters` はゲッター関数の第3引数と第4引数として渡され、アクション関数に渡される `context` オブジェクトのプロパティとしても公開されます。
-
-アクションをディスパッチするか、グローバル名前空間にミューテーションをコミットするには、`dispatch` と `commit` の3番目の引数として `{root: true}` を渡します。
-
-``` js
-modules: {
-  foo: {
-    namespaced: true,
-
-    getters: {
-      // `getters` はこのモジュールのゲッターにローカライズされています
-      // ゲッターの第4引数経由で rootGetters を使うことができます
-      someGetter (state, getters, rootState, rootGetters) {
-        getters.someOtherGetter // -> 'foo/someOtherGetter'
-        rootGetters.someOtherGetter // -> 'someOtherGetter'
-      },
-      someOtherGetter: state => { ... }
-    },
-
-    actions: {
-      // ディスパッチとコミットもこのモジュール用にローカライズされています
-      // ルートディスパッチ/コミットの `root` オプションを受け入れます
-      someAction ({ dispatch, commit, getters, rootGetters }) {
-        getters.someGetter // -> 'foo/someGetter'
-        rootGetters.someGetter // -> 'someGetter'
-
-        dispatch('someOtherAction') // -> 'foo/someOtherAction'
-        dispatch('someOtherAction', null, { root: true }) // -> 'someOtherAction'
-
-        commit('someMutation') // -> 'foo/someMutation'
-        commit('someMutation', null, { root: true }) // -> 'someMutation'
-      },
-      someOtherAction (ctx, payload) { ... }
-    }
-  }
-}
-```
-
-#### 名前空間によるバインディングヘルパー
-
-`mapState`、`mapGetters`、`mapActions`、そして `mapMutations` ヘルパーを使って名前空間付きモジュールをコンポーネントにバインディングするとき、少し冗長になります:
-
-``` js
-computed: {
-  ...mapState({
-    a: state => state.some.nested.module.a,
-    b: state => state.some.nested.module.b
-  })
-},
-methods: {
-  ...mapActions([
-    'some/nested/module/foo',
-    'some/nested/module/bar'
-  ])
-}
-```
-
-このような場合は、第1引数としてモジュールの名前空間文字列をヘルパーに渡すことで、そのモジュールをコンテキストとして使用してすべてのバインディングを行うことができます。上記は次のように単純化できます。
-
-``` js
-computed: {
-  ...mapState('some/nested/module', {
-    a: state => state.a,
-    b: state => state.b
-  })
-},
-methods: {
-  ...mapActions('some/nested/module', [
-    'foo',
-    'bar'
-  ])
-}
-```
-
-さらに、`createNamespacedHelpers` を使用することによって名前空間付けされたヘルパーを作成できます。指定された名前空間の値にバインドされた新しいコンポーネントバインディングヘルパーを持つオブジェクトを返します:
-
-``` js
-import { createNamespacedHelpers } from 'vuex'
-
-const { mapState, mapActions } = createNamespacedHelpers('some/nested/module')
-
-export default {
-  computed: {
-    // `some/nested/module` を調べます
-    ...mapState({
-      a: state => state.a,
-      b: state => state.b
-    })
-  },
-  methods: {
-    // `some/nested/module` を調べます
-    ...mapActions([
-      'foo',
-      'bar'
-    ])
-  }
-}
-```
-
-#### プラグイン開発者向けの注意事項
-
-モジュールを提供する[プラグイン](plugins.md)を作成し、ユーザーがそれらを Vuex ストアに追加できるようにすると、モジュールの予測できない名前空間が気になるかもしれません。あなたのモジュールは、プラグインユーザーが名前空間付きモジュールの元にモジュールを追加すると、その名前空間に属するようになります。この状況に適応するには、プラグインオプションを使用して名前空間の値を受け取る必要があります。
-
-``` js
-// プラグインオプションで名前空間値を取得し、
-// そして、Vuex プラグイン関数を返す
-export function createPlugin (options = {}) {
-  return function (store) {
-    /// 名前空間をプラグインモジュールの型に追加する
-    const namespace = options.namespace || ''
-    store.dispatch(namespace + 'pluginAction')
-  }
-}
-```
-
-### 動的にモジュールを登録する
-
-ストアが作られた**後**に `store.registerModule` メソッドを使って、モジュールを登録できます:
-
-``` js
-// `myModule` モジュールを登録します
-store.registerModule('myModule', {
-  // ...
-})
-
-// ネストされた `nested/myModule` モジュールを登録します
-store.registerModule(['nested', 'myModule'], {
-  // ...
-})
-```
-
-モジュールのステートには `store.state.myModule` と `store.state.nested.myModule` でアクセスします。
-
-動的なモジュール登録があることで、他の Vue プラグインが、モジュールをアプリケーションのストアに付属させることで、状態の管理に Vuex を活用できます。例えば [`vuex-router-sync`](https://github.com/vuejs/vuex-router-sync) ライブラリは、動的に付属させたモジュール内部でアプリケーションのルーティングのステートを管理することで vue-router と vuex を統合しています。
-
-`store.unregisterModule(moduleName)` を呼び出せば、動的に登録したモジュールを削除できます。ただしストア作成(store creation)の際に宣言された、静的なモジュールはこのメソッドで削除できないことに注意してください。
-
-サーバサイドレンダリングされたアプリケーションから状態を保持するなど、新しいモジュールを登録するときに、以前の状態を保持したい場合があります。`preserveState` オプション(`store.registerModule('a', module, { preserveState: true })`)でこれを実現できます。
-
-### モジュールの再利用
-
-時どき、モジュールの複数インスタンスを作成する必要があるかもしれません。例えば:
-
-- 同じモジュールを使用する複数のストアを作成する;
-- 同じストアに同じモジュールを複数回登録する
-
-モジュールの状態を宣言するために単純なオブジェクトを使用すると、その状態オブジェクトは参照によって共有され、変更時にクロスストア/モジュールの状態汚染を引き起こします。(例: `runInNewContext` オプションが `false` または `'once'` のとき、[SSR ではステートフルなシングルトンは避けます](https://ssr.vuejs.org/ja/structure.html#ステートフルなシングルトンの回避)。)
-
-これは、実際には Vue コンポーネント内部の `data` と全く同じ問題です。従って解決策も同じです。モジュールの状態を宣言するために関数を使用してください (2.3.0 以降でサポートされます):
-
-``` js
-const MyReusableModule = {
-  state () {
-    return {
-      foo: 'bar'
-    }
-  },
-  // ミューテーション、アクション、ゲッター...
-}
-```

+ 0 - 172
docs-gitbook/ja/mutations.md

@@ -1,172 +0,0 @@
-# ミューテーション
-
-実際に Vuex のストアの状態を変更できる唯一の方法は、ミューテーションをコミットすることです。Vuex のミューテーションはイベントにとても近い概念です: 各ミューテーションは**タイプ**と**ハンドラ**を持ちます。ハンドラ関数は Vuex の状態(state)を第1引数として取得し、実際に状態の変更を行います:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 1
-  },
-  mutations: {
-    increment (state) {
-      // 状態を変更する
-      state.count++
-    }
-  }
-})
-```
-
-直接ミューテーションハンドラを呼び出すことはできません。この mutations オプションは、どちらかいうと "タイプが `increment` のミューテーションがトリガーされたときに、このハンドラが呼ばれる" といったイベント登録のようなものです。ミューテーションハンドラを起動するためにはミューテーションのタイプを指定して `store.commit` を呼び出す必要があります:
-
-``` js
-store.commit('increment')
-```
-
-### 追加の引数を渡してコミットする
-
-`store.commit` に追加の引数を渡すこともできます。この追加の引数は、特定のミューテーションに対する**ペイロード**と呼びます:
-
-``` js
-// ...
-mutations: {
-  increment (state, n) {
-    state.count += n
-  }
-}
-```
-
-``` js
-store.commit('increment', 10)
-```
-
-ほとんどの場合、ペイロードはオブジェクトにすべきです。そうすることで複数のフィールドを含められるようになり、またミューテーションがより記述的に記録されるようになります:
-
-``` js
-// ...
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-``` js
-store.commit('increment', {
-  amount: 10
-})
-```
-
-### オブジェクトスタイルのコミット
-
-また `type` プロパティを持つオブジェクトを使って、ミューテーションをコミットすることもできます:
-
-``` js
-store.commit({
-  type: 'increment',
-  amount: 10
-})
-```
-
-オブジェクトスタイルでコミットするとき、オブジェクト全体がペイロードとしてミューテーションハンドラに渡されます。したがってハンドラの例は上記と同じです:
-
-``` js
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-
-### Vue のリアクティブなルールに則ったミューテーション
-
-Vuex ストアの状態は Vue によってリアクティブになっているので、状態を変更すると、状態を監視している Vue コンポーネントは自動的に更新されます。これは Vuex のミューテーションは、通常の Vue と動作させているときと同じく、リアクティブな値に関する注意が必要であることを意味します:
-
-1. あらかじめ全ての必要なフィールドによって、ストアの初期状態を初期化することが望ましいです
-
-2. 新しいプロパティをオブジェクトに追加するとき、以下のいずれかが必要です:
-
-  - `Vue.set(obj, 'newProp', 123)` を使用する。あるいは
-
-  - 全く新しいオブジェクトで既存のオブジェクトを置き換える。例えば、stage-3 の[スプレッドシンタックス(object spread syntax)](https://github.com/sebmarkbage/ecmascript-rest-spread) を使用して、次のように書くことができます:
-
-    ``` js
-    state.obj = { ...state.obj, newProp: 123 }
-    ```
-
-### ミューテーション・タイプに定数を使用する
-
-いろいろな Flux 実装において、ミューテーション・タイプに定数を使用することが共通して見られるパターンです。これはコードに対してリントツールのようなツールを利用できるという利点があり、また単一ファイルに全ての定数を設定することによって、共同で作業する人に、アプリケーション全体で何のミューテーションが可能であるかを一目見ただけで理解できるようにします:
-
-``` js
-// mutation-types.js
-export const SOME_MUTATION = 'SOME_MUTATION'
-```
-
-``` js
-// store.js
-import Vuex from 'vuex'
-import { SOME_MUTATION } from './mutation-types'
-
-const store = new Vuex.Store({
-  state: { ... },
-  mutations: {
-    // 定数を関数名として使用できる ES2015 の算出プロパティ名(computed property name)機能を使用できます
-    [SOME_MUTATION] (state) {
-      // 状態を変更する
-    }
-  }
-})
-```
-
-定数を使用するかどうかは好みの問題です。多くの開発者による大規模なプロジェクトで役に立ちますが、完全にオプションなので、もしお気に召さなければ使用しなくても構いません。
-
-### ミューテーションは同期的でなければならない
-
-ひとつの重要なルールを覚えておきましょう。それは**ミューテーションハンドラ関数は同期的でなければならない**ということです。なぜか?次の例で考えてみましょう:
-
-``` js
-mutations: {
-  someMutation (state) {
-    api.callAsyncMethod(() => {
-      state.count++
-    })
-  }
-}
-```
-
-いま、開発ツールのミューテーションのログを見ながら、アプリケーションのデバッグを行っていることを想像してください。全てのミューテーションをログに記録するためには、ミューテーションの前後の状態のスナップショットを捕捉することが必要です。しかし、上の例にあるミューテーション内の非同期コールバックは、それを不可能にします: そのコールバックは、ミューテーションがコミットされた時点ではまだ呼び出されていません。そして、コールバックが実際にいつ呼び出されるかを、開発ツールは知る術がありません。いかなる状態変更でも、コールバック内で起きる場合は本質的に追跡不可能です。
-
-### コンポーネント内におけるミューテーションのコミット
-
-`this.$store.commit('xxx')` と書くか、もしくはコンポーネントのメソッドを `store.commit` にマッピングする `mapMutations` ヘルパーを呼び出すこと(ルートの `store` の注入が必要)で、コンポーネント内でミューテーションをコミットできます:
-
-``` js
-import { mapMutations } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapMutations([
-      'increment', // `this.increment()` を `this.$store.commit('increment')` にマッピングする
-
-      // mapMutations はペイロードサポートする:
-      'incrementBy' // `this.incrementBy(amount)` を `this.$store.commit('incrementBy', amount)` にマッピングする
-    ]),
-    ...mapMutations({
-      add: 'increment' // `this.add()` を `this.$store.commit('increment')` にマッピングする
-    })
-  }
-}
-```
-
-### アクションへ向けて
-
-状態変更を非同期に組み合わせることは、プログラムの動きを予測することを非常に困難にします。例えば、状態を変更する非同期コールバックを持った 2つのメソッドを両方呼び出すとき、それらがいつ呼び出されたか、どちらが先に呼び出されたかを、どうやって知ればよいのでしょう?これがまさに、状態変更と非同期の 2つの概念を分離したいという理由です。Vuex では**全てのミューテーションは同期的に行う**という作法になっています:
-
-``` js
-store.commit('increment')
-// "increment" ミューテーションによる状態変更は、この時点で行われるべきです
-```
-
-非同期的な命令を扱うために[アクション](actions.md)を見てみましょう。

+ 0 - 126
docs-gitbook/ja/plugins.md

@@ -1,126 +0,0 @@
-# プラグイン
-
-Vuex ストア は、各ミューテーションへのフックを公開する `plugins` オプションを受け付けます。 Vuex プラグインは、単一の引数としてストアを受けつけるただの関数です:
-
-``` js
-const myPlugin = store => {
-  // ストアが初期化されたときに呼ばれます
-  store.subscribe((mutation, state) => {
-    // それぞれのミューテーションの後に呼ばれます
-    // ミューテーションは `{ type, payload }` の形式で提供されます
-  })
-}
-```
-
-そして、このように利用することができます:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: [myPlugin]
-})
-```
-
-### プラグイン内でのミューテーションのコミット
-
-プラグインは直接、状態を変更できません。これはコンポーネントに似ています。プラグインはコンポーネント同様に、ミューテーションのコミットによる変更のトリガーだけで状態を変更できます。
-
-ミューテーションのコミットによるストアとデータソースの同期をプラグインで実現できます。 websocket データソースとストアを例にします (これは不自然な例です。実際には、さらに複雑なタスクのために `createPlugin` 関数は、追加でいくつかのオプションを受け取れます):
-
-``` js
-export default function createWebSocketPlugin (socket) {
-  return store => {
-    socket.on('data', data => {
-      store.commit('RECEIVE_DATA', data)
-    })
-    store.subscribe((mutation) => {
-      if (mutation.type === 'UPDATE_DATA') {
-        socket.emit('update', mutation.payload)
-      }
-    })
-  }
-}
-```
-
-``` js
-const plugin = createWebSocketPlugin(socket)
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  plugins: [plugin]
-})
-```
-
-### 状態のスナップショットを撮る
-
-時々、状態の"スナップショット"を撮って、ミューテーション前後の状態を比較したくなることがあるでしょう。それを実現するために、状態オブジェクトのディープコピーを行う必要があります:
-
-``` js
-const myPluginWithSnapshot = store => {
-  let prevState = _.cloneDeep(store.state)
-  store.subscribe((mutation, state) => {
-    let nextState = _.cloneDeep(state)
-
-    // `prevState` と `nextState` を比較...
-
-    // 次のミューテーションのために状態を保存
-    prevState = nextState
-  })
-}
-```
-
-**状態のスナップショットを撮るプラグインはアプリケーションの開発の間だけ使われるべきです。**  webpack や Browserify を使っていれば、ビルドツールにそれを処理させることができます:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: process.env.NODE_ENV !== 'production'
-    ? [myPluginWithSnapshot]
-    : []
-})
-```
-
-上のように記述すれば、プラグインはデフォルトで利用されることになります。本番環境( production ) では、 `process.env.NODE_ENV !== 'production'` を `false` に置き換えるために、 webpack では[DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 、 Browserify では[envify](https://github.com/hughsk/envify) が必要になります。
-
-### ビルトインロガープラグイン
-
-> もし、あなたが [vue-devtools](https://github.com/vuejs/vue-devtools) を使っている場合は、これは不要でしょう。
-
-Vuex には、一般的なデバッグに利用する用途の備え付けのロガープラグインがあります。
-
-```js
-import createLogger from 'vuex/dist/logger'
-
-const store = new Vuex.Store({
-  plugins: [createLogger()]
-})
-```
-
-`createLogger` 関数はいくつかのオプションを受け取ります:
-
-``` js
-const logger = createLogger({
-  collapsed: false, // ログ出力されたミューテーションを自動で展開します
-  filter (mutation, stateBefore, stateAfter) {
-    // ミューテーションを記録する必要がある場合は、`true` を返します
-    // `mutation` は `{ type, payload }` です
-    return mutation.type !== "aBlacklistedMutation"
-  },
-  transformer (state) {
-    // ロギングの前に、状態を変換します
-    // 例えば、特定のサブツリーのみを返します
-    return state.subTree
-  },
-  mutationTransformer (mutation) {
-    // ミューテーションは、`{ type, payload }` の形式でログ出力されます
-    // 任意の方法でそれをフォーマットできます
-    return mutation.type
-  },
-  logger: console, // `console` API の実装, デフォルトは `console`
-})
-```
-
-ロガーファイルは、他にも `<script>` タグで直接読み込むことができ、`createVuexLogger` 関数がグローバルに公開されます。
-
-ロガープラグインは、状態のスナップショットを撮ることに注意しましょう。スナップショットを撮ることはコストがかかるため、開発中だけ利用してください。

+ 0 - 106
docs-gitbook/ja/state.md

@@ -1,106 +0,0 @@
-# ステート
-
-### 単一ステートツリー
-
-Vuex は**単一ステートツリー (single state tree)**を使います。つまり、この単一なオブジェクトはアプリケーションレベルの状態が全て含まれており、"信頼できる唯一の情報源 (single source of truth)" として機能します。これは、通常、アプリケーションごとに1つしかストアは持たないことを意味します。単一ステートツリーは状態の特定の部分を見つけること、デバッグのために現在のアプリケーションの状態のスナップショットを撮ることを容易にします。
-
-単一ステートツリーはモジュール性と競合しません。以降の章で、アプリケーションの状態とミューテーション(変更)をサブモジュールに分割する方法について説明します。
-
-### Vuex の状態を Vue コンポーネントに入れる
-
-ストアにある状態を Vue コンポーネント に表示するにはどうすればよいのでしょう? Vuex ストア はリアクティブなので、ストアから状態を"取り出す"一番シンプルな方法は、単純にいくつかのストアの状態を [算出プロパティ](https://jp.vuejs.org/guide/computed.html) で返すことです。
-
-```js
-// Counter コンポーネントをつくってみましょう
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return store.state.count
-    }
-  }
-}
-```
-
-`store.state.count` が変わるたび、算出プロパティの再評価が発生し、関連した DOM の更新をトリガーします。
-
-しかし、このパターンでは、コンポーネントがグローバルストアシングルトンに依存してしまいます。 モジュールシステムを使っているとき、ストアの状態を使っているすべてのコンポーネントでインポートが必要です。また、コンポーネントのテストのときにモック化が必要となります。
-
-Vuex は、ルートコンポーネントに `store` オプションを指定することで (これは、 `Vue.use(Vuex)` で有効にできます)、すべての子コンポーネントにストアを "注入" する機構を提供しています:
-
-```js
-const app = new Vue({
-  el: '#app',
-  // "store" オプションで指定されたストアは、全ての子コンポーネントに注入されます
-  store,
-  components: { Counter },
-  template: `
-    <div class="app">
-      <counter></counter>
-    </div>
-  `
-})
-```
-
-ルートインスタンスに `store` オプションを渡すことで、渡されたストアをルートの全ての子コンポーネントに注入します。これは `this.$store` で各コンポーネントから参照することができます。 `Counter` の実装を変更しましょう:
-
-```js
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return this.$store.state.count
-    }
-  }
-}
-```
-
-### `mapState`  ヘルパー
-
-コンポーネントが複数のストアのステートプロパティやゲッターを必要としているとき、これらすべてにおいて、算出プロパティを宣言することは繰り返しで冗長です。これに対処するため、算出ゲッター関数を生成し、いくつかのキーストロークを省くのに役立つ `mapState` ヘルパーを使うことができます:
-
-```js
-// 完全ビルドでは、ヘルパーは Vuex.mapState として公開されています
-import { mapState } from 'vuex'
-
-export default {
-  // ...
-  computed: mapState({
-    // アロー関数は、コードをとても簡潔にできます!
-    count: state => state.count,
-    // 文字列を渡すことは、`state => state.count` と同じです
-    countAlias: 'count',
-    // `this` からローカルステートを参照するときは、通常の関数を使わなければいけません
-    countPlusLocalState (state) {
-      return state.count + this.localCount
-    }
-  })
-}
-```
-
-マップされた算出プロパティの名前がステートサブツリーの名前と同じ場合は、文字列配列を `mapState` に渡すこともできます。
-
-```js
-computed: mapState([
-  // map this.count to store.state.count
-  'count'
-])
-```
-
-### オブジェクトスプレッド演算子
-
-`mapState` はオブジェクトを返すことに注意しましょう。どうやって、他のローカル算出プロパティと組み合わせるのでしょうか? 通常、最終的にひとつのオブジェクトを `computed` に渡せるように、複数のオブジェクトをひとつにマージするユーティリティを使わなければいけません。しかし、[オブジェクトスプレッド演算子](https://github.com/sebmarkbage/ecmascript-rest-spread) (ECMAScript プロポーサルの state-4 です) で、シンタックスをかなり単純にできます:
-
-```js
-computed: {
-  localComputed () { /* ... */ },
-  // オブジェクトスプレット演算子で、外のオブジェクトとこのオブジェクトを混ぜる
-  ...mapState({
-    // ...
-  })
-}
-```
-
-### コンポーネントはまだローカルステートを持つことできる
-
-Vuex を使うということは、**全て**の状態を Vuex の中に置くべき、というわけではありません。多くの状態を Vuex に置くことで、状態の変更がさらに明示的、デバッグ可能になりますが、ときにはコードを冗長でまわりくどいものにします。状態の一部がひとつのコンポーネントだけに属している場合は、それをローカルの状態として残しておくとよいでしょう。あなたは、トレードオフを考慮した上で、あなたのアプリの開発ニーズに合った決定をすべきです。

+ 0 - 25
docs-gitbook/ja/strict.md

@@ -1,25 +0,0 @@
-# 厳格モード
-
-厳格(strict)モードを有効にするには Vuex store を作成するときに、ただ `strict: true` を指定するだけです:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: true
-})
-```
-
-厳格モードでは Vuex の状態がミューテーションハンドラの外部で変更されたら、エラーを投げるようになります。これで全ての状態変更がデバッギングツールで明示的に追跡できることが保証されます。
-
-### 開発環境 vs 本番環境
-
-**本番環境で厳格モードを有効にしてデプロイしてはいけません!**厳格モードでは不適切なミューテーションを検出するためにステートツリーに対して深い監視を実行します。パフォーマンスコストを回避するために本番環境では無効にしてください。
-
-プラグインと同様に、ビルドツールに処理させることができます:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: process.env.NODE_ENV !== 'production'
-})
-```

+ 0 - 32
docs-gitbook/ja/structure.md

@@ -1,32 +0,0 @@
-# アプリケーションの構造
-
-Vuex は実際のところ、あなたがコードを構造化する方法を制限しません。もっと正確に言うと、それより高いレベルの原理原則を適用させます:
-
-1. アプリケーションレベルの状態はストアに集約されます。
-
-2. 状態を変更する唯一の方法は、同期的に処理を行う**ミューテーション**をコミットすることのみです。
-
-3. 非同期的なロジックはカプセル化されるべきであり、それは**アクション**によって構成されます。
-
-これらのルールに従っている限り、プロジェクトをどのように構造化するかはあなた次第です。もしストアファイルが大きくなり過ぎたら、単純にアクションやミューテーション、ゲッターをそれぞれ別のファイルに切り出すことができます。
-
-それなりに手の込んだアプリケーションであれば、モジュールを活用する必要が出てきそうです。プロジェクトの構造の例は以下のようになります:
-
-``` bash
-├── index.html
-├── main.js
-├── api
-│   └── ... # API 呼び出しを抽象化する
-├── components
-│   ├── App.vue
-│   └── ...
-└── store
-    ├── index.js          # モジュールを集めてストアをエクスポートする
-    ├── actions.js        # アクションのルートファイル
-    ├── mutations.js      # ミューテーションのルートファイル
-    └── modules
-        ├── cart.js       # cart モジュール
-        └── products.js   # products モジュール
-```
-
-参考として [Shopping Cart Example](https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart) をみてみるのもよいでしょう。

+ 0 - 221
docs-gitbook/ja/testing.md

@@ -1,221 +0,0 @@
-# テスト
-
-私たちが Vuex でユニットテストしたい主な部分はミューテーションとアクションです。
-
-### ミューテーションのテスト
-
-ミューテーションは完全に引数に依存しているだけの関数であるため、テストするのがとても簡単です。効果的なやり方として、もし ES2015 のモジュールを使っていて `store.js` ファイルの中にミューテーションがあるなら、デフォルトエクスポートに加えて、名前付きエクスポートでミューテーションをエクスポートできます。
-
-``` js
-const state = { ... }
-
-// 名前付きエクスポートでミューテーションをエクスポートする
-export const mutations = { ... }
-
-export default new Vuex.Store({
-  state,
-  mutations
-})
-```
-
-Mocha + Chai を使用してミューテーションをテストする例です(あなたの好きな任意のフレームワーク/アサーションライブラリを使用できます):
-
-``` js
-// mutations.js
-export const mutations = {
-  increment: state => state.count++
-}
-```
-
-``` js
-// mutations.spec.js
-import { expect } from 'chai'
-import { mutations } from './store'
-
-// ミューテーションの分割束縛
-const { increment } = mutations
-
-describe('mutations', () => {
-  it('INCREMENT', () => {
-    // ステートのモック
-    const state = { count: 0 }
-    // ミューテーションを適用する
-    increment(state)
-    // 結果を検証する
-    expect(state.count).to.equal(1)
-  })
-})
-```
-
-### アクションのテスト
- 
-アクションは外部の API を呼び出す可能性があるため、ミューテーションのテストよりも少し注意が必要です。アクションをテストするとき、通常、いくつかの段階でモックを作る必要があります。例えば API 呼び出しをサービスとして抽象化し、そしてテストの内部ではそのサービスをモックにすることができます。簡単に依存関係をモック化するために、webpack と [inject-loader](https://github.com/plasticine/inject-loader) を使ってテストファイルをバンドルすることができます。
-
-非同期なアクションのテストの例:
-
-``` js
-// actions.js
-import shop from '../api/shop'
-
-export const getAllProducts = ({ commit }) => {
-  commit('REQUEST_PRODUCTS')
-  shop.getProducts(products => {
-    commit('RECEIVE_PRODUCTS', products)
-  })
-}
-```
-
-``` js
-// actions.spec.js
-
-// inline loader のために require 構文を使用する
-// ここでは inject-loader を使って、モック化された依存関係を注入できるようにするモジュールファクトリーを返す
-import { expect } from 'chai'
-const actionsInjector = require('inject-loader!./actions')
-
-// モックによってモジュールを作成する
-const actions = actionsInjector({
-  '../api/shop': {
-    getProducts (cb) {
-      setTimeout(() => {
-        cb([ /* レスポンスのモック */ ])
-      }, 100)
-    }
-  }
-})
-
-// 期待されるミューテーションをアクションが呼び出すかをテストするためのヘルパー
-const testAction = (action, payload, state, expectedMutations, done) => {
-  let count = 0
-
-  // コミットをモックする
-  const commit = (type, payload) => {
-    const mutation = expectedMutations[count]
-
-    try {
-      expect(type).to.equal(mutation.type)
-      if (payload) {
-        expect(payload).to.deep.equal(mutation.payload)
-      }
-    } catch (error) {
-      done(error)
-    }
-
-    count++
-    if (count >= expectedMutations.length) {
-      done()
-    }
-  }
-
-  // モック化したストアと引数でアクションを呼び出す
-  action({ commit, state }, payload)
-
-  // 呼び出されるべきミューテーションが残っていないか確認する
-  if (expectedMutations.length === 0) {
-    expect(count).to.equal(0)
-    done()
-  }
-}
-
-describe('actions', () => {
-  it('getAllProducts', done => {
-    testAction(actions.getAllProducts, null, {}, [
-      { type: 'REQUEST_PRODUCTS' },
-      { type: 'RECEIVE_PRODUCTS', payload: { /* レスポンスのモック */ } }
-    ], done)
-  })
-})
-```
-
-### ゲッターのテスト
-
-もしゲッターが複雑な計算を行っているならば、テストコードを書く価値があります。ゲッターはミューテーションと同様の理由でテストしやすいです。
-
-ゲッターのテストの例:
-
-``` js
-// getters.js
-export const getters = {
-  filteredProducts (state, { filterCategory }) {
-    return state.products.filter(product => {
-      return product.category === filterCategory
-    })
-  }
-}
-```
-
-``` js
-// getters.spec.js
-import { expect } from 'chai'
-import { getters } from './getters'
-
-describe('getters', () => {
-  it('filteredProducts', () => {
-    // ステートをモックする
-    const state = {
-      products: [
-        { id: 1, title: 'Apple', category: 'fruit' },
-        { id: 2, title: 'Orange', category: 'fruit' },
-        { id: 3, title: 'Carrot', category: 'vegetable' }
-      ]
-    }
-    // ゲッターをモックする
-    const filterCategory = 'fruit'
-
-    // ゲッターから結果を受け取る
-    const result = getters.filteredProducts(state, { filterCategory })
-
-    // 結果を検証する
-    expect(result).to.deep.equal([
-      { id: 1, title: 'Apple', category: 'fruit' },
-      { id: 2, title: 'Orange', category: 'fruit' }
-    ])
-  })
-})
-```
-
-### テストの実行
-
-ミューテーションやアクションが適切に書かれている場合は、適切にモック化された後、テストコードはブラウザの API に直接依存関係を持つことはないでしょう。したがって、単純に webpack でテストをバンドルでき、それを直接 Node で実行できます。別の方法として、本当のブラウザでテストを実行するためには `mocha-loader` または Karma + `karma-webpack` を使用できます。
-
-#### Node での実行
-
-以下のような webpack の設定を作成します([`.babelrc`](https://babeljs.io/docs/usage/babelrc/) もあわせて使います):
-
-``` js
-// webpack.config.js
-module.exports = {
-  entry: './test.js',
-  output: {
-    path: __dirname,
-    filename: 'test-bundle.js'
-  },
-  module: {
-    loaders: [
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/
-      }
-    ]
-  }
-}
-```
-
-それから下記コマンドを実行します:
-
-``` bash
-webpack
-mocha test-bundle.js
-```
-
-#### ブラウザでの実行
-
-1. `mocha-loader` をインストールする
-2. 上記 webpack 設定から `entry` を `'mocha-loader!babel-loader!./test.js'` に変更する
-3. 設定を使用して `webpack-dev-server` を開始する
-4. ブラウザで `localhost:8080/webpack-dev-server/test-bundle` を開く 
-
-#### Karma + karma-webpack を使ったブラウザでの実行
-
-[vue-loader ドキュメント](https://vue-loader.vuejs.org/ja/workflow/testing.html) 内のセットアップ方法を参考にしてください。

+ 0 - 1
docs-gitbook/kr/README.md

@@ -1 +0,0 @@
-{% include "./SUMMARY.md" %}

+ 0 - 24
docs-gitbook/kr/SUMMARY.md

@@ -1,24 +0,0 @@
-# Vuex
-
-<!--email_off-->
-> 참고: 이 문서는 vuex@2.x 을 기준으로 합니다.
-<!--/email_off-->
-
-- [1.0 버전 문서를 보려면?](https://github.com/vuejs/vuex/tree/1.0/docs)
-- [릴리즈 노트](https://github.com/vuejs/vuex/releases)
-- [설치](installation.md)
-- [Vuex가 무엇인가요?](intro.md)
-- [시작하기](getting-started.md)
-- 핵심 컨셉
-  - [상태](state.md)
-  - [Getters](getters.md)
-  - [변이](mutations.md)
-  - [액션](actions.md)
-  - [모듈](modules.md)
-- [애플리케이션 구조](structure.md)
-- [플러그인](plugins.md)
-- [Strict 모드](strict.md)
-- [폼 핸들링](forms.md)
-- [테스팅](testing.md)
-- [핫 리로딩](hot-reload.md)
-- [API 레퍼런스](api.md)

+ 0 - 175
docs-gitbook/kr/actions.md

@@ -1,175 +0,0 @@
-# 액션
-
-액션은 변이와 유사합니다. 몇가지 다른 점은,
-
-- 상태를 변이시키는 대신 액션으로 변이에 대한 커밋을 합니다.
-- 작업에는 임의의 비동기 작업이 포함될 수 있습니다.
-
-간단한 액션을 등록합시다.
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  },
-  actions: {
-    increment (context) {
-      context.commit('increment')
-    }
-  }
-})
-```
-
-액션 핸들러는 저장소 인스턴스의 같은 메소드들/프로퍼티 세트를 드러내는 컨텍스트 객체를 받습니다. 그래서 `context.commit`을 호출하여 변이를 커밋하거나 `context.state`와 `context.getters`를 통해 상태와 getters에 접근 할 수 있습니다. 나중에 [모듈](modules.md)에서 이 컨텍스트 객체가 저장소 인스턴스 자체가 아닌 이유를 알 수 있습니다.
-
-실제로 (특히 `commit`를 여러 번 호출해야하는 경우)코드를 단순화하기 위해 ES2015 [전달인자 분해](https://github.com/lukehoban/es6features#destructuring)를 사용합니다.
-
-``` js
-actions: {
-  increment ({ commit }) {
-    commit('increment')
-  }
-}
-```
-
-### 디스패치 액션
-
-액션은 `store.dispatch` 메소드로 시작됩니다.
-
-``` js
-store.dispatch('increment')
-```
-
-처음 볼 때는 이상해 보일 수 있습니다. 카운트를 증가 시키려면 `store.commit('increment')`를 직접 호출하면 어떻습니까? 음, **상태변이는 동기적** 이어야 한다는 것을 기억하십니까? 액션은 그렇지 않습니다. 액션 내에서 **비동기** 작업을 수행 할 수 있습니다.
-
-``` js
-actions: {
-  incrementAsync ({ commit }) {
-    setTimeout(() => {
-      commit('increment')
-    }, 1000)
-  }
-}
-```
-
-액션은 동일한 페이로드 타입과 객체 스타일의 디스패치를 지원합니다.
-
-``` js
-// 페이로드와 함께 디스패치
-store.dispatch('incrementAsync', {
-  amount: 10
-})
-
-// 객체와 함께 디스패치
-store.dispatch({
-  type: 'incrementAsync',
-  amount: 10
-})
-```
-
-액션의 좀 더 실용적인 예는 **비동기 API 호출** 과 **여러 개의 변이를 커밋** 하는 장바구니 결제입니다.
-
-``` js
-actions: {
-  checkout ({ commit, state }, products) {
-    // 장바구니에 현재있는 항목을 저장하십시오.
-    const savedCartItems = [...state.cart.added]
-
-    // 결제 요청을 보낸 후 장바구니를 비웁니다.
-    commit(types.CHECKOUT_REQUEST)
-
-    // 상점 API는 성공 콜백 및 실패 콜백을 받습니다.
-    shop.buyProducts(
-      products,
-      // 요청 성공 핸들러
-      () => commit(types.CHECKOUT_SUCCESS),
-      // 요청 실패 핸들러
-      () => commit(types.CHECKOUT_FAILURE, savedCartItems)
-    )
-  }
-}
-```
-
-비동기 작업의 흐름을 수행하고 커밋하여 작업의 사이드이펙트(상태 변이)을 기록합니다.
-
-### 컴포넌트 내부에서 디스패치 액션 사용하기
-
-`this.$store.dispatch('xxx')`를 사용하여 컴포넌트에서 액션을 디스패치하거나 컴포넌트 메소드를 `store.dispatch` 호출에 매핑하는 `mapActions` 헬퍼를 사용할 수 있습니다 (루트 `store` 주입 필요) :
-
-``` js
-import { mapActions } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapActions([
-      'increment' // this.increment()을 this.$store.dispatch('increment')에 매핑
-    ]),
-    ...mapActions({
-      add: 'increment' // this.add()을 this.$store.dispatch('increment')에 매핑
-    })
-  }
-}
-```
-
-### 액션 구성하기
-
-액션은 종종 비동기적 입니다. 그러면 액션이 언제 완료되는지 어떻게 알 수 있습니까? 더 중요한 것은, 복잡한 비동기 흐름을 처리하기 위해 어떻게 여러 작업을 함께 구성 할 수 있습니까?
-
-가장 먼저 알아야 할 점은 `store.dispatch`가 트리거 된 액션 핸들러에 의해 반환된 Promise를 처리 할 수 있으며 Promise를 반환한다는 것입니다.
-
-``` js
-actions: {
-  actionA ({ commit }) {
-    return new Promise((resolve, reject) => {
-      setTimeout(() => {
-        commit('someMutation')
-        resolve()
-      }, 1000)
-    })
-  }
-}
-```
-
-이렇게 할 수 있습니다.
-
-``` js
-store.dispatch('actionA').then(() => {
-  // ...
-})
-```
-
-그리고 안에 또 다른 액션을 사용할 수 있습니다.
-
-``` js
-actions: {
-  // ...
-  actionB ({ dispatch, commit }) {
-    return dispatch('actionA').then(() => {
-      commit('someOtherMutation')
-    })
-  }
-}
-```
-
-마지막으로, JavaScript 기능인 [async/await](https://tc39.github.io/ecmascript-asyncawait/)를 사용하면 다음과 같은 작업을 구성 할 수 있습니다.
-
-``` js
-// getData() 및 getOtherData()가 Promise를 반환한다고 가정합니다.
-actions: {
-  async actionA ({ commit }) {
-    commit('gotData', await getData())
-  },
-  async actionB ({ dispatch, commit }) {
-    await dispatch('actionA') // actionA가 끝나기를 기다립니다.
-    commit('gotOtherData', await getOtherData())
-  }
-}
-```
-
-> `store.dispatch`가 다른 모듈에서 여러 액션 핸들러를 트리거하는 것이 가능합니다. 이 경우 반환 된 값은 모든 트리거 된 처리기가 완료 되었을 때 처리되는 Promise입니다.

+ 0 - 192
docs-gitbook/kr/api.md

@@ -1,192 +0,0 @@
-# API 레퍼런스
-
-### Vuex.Store
-
-``` js
-import Vuex from 'vuex'
-
-const store = new Vuex.Store({ ...options })
-```
-
-### Vuex.Store 생성자 옵션
-
-- **state**
-
-  - 자료형: `Object`
-
-    Vuex 저장소의 루트 상태 객체 입니다.
-
-    [상세](state.md)
-
-- **mutations**
-
-  - 자료형: `{ [type: string]: Function }`
-
-    저장소에 변이를 등록하십시오. 핸들러 함수는 항상 첫 번째 전달인자로 `state`를 받습니다 (모듈에 정의 된 경우 모듈 로컬 상태가됩니다). 두 번째 `payload` 전달인자가 있으면 처리합니다.
-
-    [상세](mutations.md)
-
-- **actions**
-
-  - 자료형: `{ [type: string]: Function }`
-
-    저장소에 액션을 등록하십시오. 핸들러 함수는 다음 속성을 노출하는 `context` 객체를받습니다.
-
-    ``` js
-    {
-      state,     // store.state와 같습니다. 또는 모듈에 있는 경우 로컬 상태
-      rootState, // store.state와 같습니다. 모듈 안에만 존재합니다
-      commit,    // store.commit와 같습니다.
-      dispatch,  // store.dispatch와 같습니다.
-      getters    // store.getters와 같습니다.
-    }
-    ```
-
-    [상세](actions.md)
-
-- **getters**
-
-  - 자료형: `{ [key: string]: Function }`
-
-    저장소에 getter를 등록하십시오. getter 함수는 다음 전달인자를 받습니다.
-
-    ```
-    state,     // 모듈에 정의 된 경우 모듈 로컬 상태가됩니다.
-    getters,   // store.getters와 같습니다.
-    rootState  // store.state와 같습니다.
-    ```
-
-    등록된 getter는 `store.getters`에 노출됩니다.
-
-    [상세](getters.md)
-
-- **modules**
-
-  - 자료형: `Object`
-
-    저장소에 병합될 하위 모듈을 포함하는 객체 입니다.
-
-    ``` js
-    {
-      key: {
-        state,
-        mutations,
-        actions?,
-        getters?,
-        modules?
-      },
-      ...
-    }
-    ```
-
-    각 모듈은 루트 옵션과 비슷한 `state` 와 `mutations` 를 포함 할 수 있습니다. 모듈의 상태는 모듈의 키를 사용하여 저장소의 루트 상태에 연결됩니다. 모듈의 변이와 getter는 모듈의 로컬 상태를 루트 상태 대신 첫 번째 전달인자로 받으며 모듈 액션의 `context.state`도 로컬 상태를 가리 킵니다.
-
-    [상세](modules.md)
-
-- **plugins**
-
-  - 자료형: `Array<Function>`
-
-    저장소에 적용 할 플러그인 함수의 배열입니다. 플러그인은 저장소를 유일한 전달인자로 받아들이고 아웃바운드 데이터 지속성, 로깅 또는 디버깅을 위한 변이를 감시하거나 (인바운드 데이터 (예: 웹 소켓 또는 관찰 가능 항목)의 디스패치 변이) 감시할 수 있습니다.
-
-    [상세](plugins.md)
-
-- **strict**
-
-  - 자료형: `Boolean`
-  - 기본값: `false`
-
-    Vuex 저장소를 strict 모드로 변경합니다. strict 모드에서 변이 핸들러 외부의 Vuex 상태에 대한 임의의 변이는 오류를 발생시킵니다.
-
-    [상세](strict.md)
-
-### Vuex.Store 인스턴스 속성
-
-- **state**
-
-  - 자료형: `Object`
-
-    루트 상태. 읽기 전용
-
-- **getters**
-
-  - 자료형: `Object`
-
-    등록된 getters 입니다. 읽기 전용.
-
-### Vuex.Store 인스턴스 메소드
-
-- **`commit(type: string, payload?: any) | commit(mutation: Object)`**
-
-  변이를 커밋합니다. [상세](mutations.md)
-
-- **`dispatch(type: string, payload?: any) | dispatch(action: Object)`**
-
-  액션을 디스패치 합니다. 모든 트리거된 액션 핸들러를 처리하는 Promise를 반환합니다. [상세](actions.md)
-
-- **`replaceState(state: Object)`**
-
-  저장소의 루트 상태를 바꿉니다. 상태에 대한 상호작용/시점 변경 목적으로 만 사용하십시오.
-
-- **`watch(getter: Function, cb: Function, options?: Object)`**
-
-  getter 함수의 반환 값을 반응적으로 지켜보고 값이 변경되면 콜백을 호출합니다. getter는 저장소의 상태를 유일한 인수로받습니다. Vue의 `vm.$watch` 메소드와 같은 옵션을 취하는 옵션 객체를 받아들입니다.
-
-  감시를 중단하려면 반환된 핸들 함수를 호출하십시오.
-
-- **`subscribe(handler: Function)`**
-
-  저장소 변이를 구독합니다. `handler`는 모든 변이 이후 호출되고 변이 디스크립터와 변이 상태를 전달인자로 받습니다.
-
-  ``` js
-  store.subscribe((mutation, state) => {
-    console.log(mutation.type)
-    console.log(mutation.payload)
-  })
-  ```
-
-  플러그인에서 가장 일반적으로 사용됩니다. [상세](plugins.md)
-
-- **`registerModule(path: string | Array<string>, module: Module, options?: Object)`**
-
-  동적 모듈을 등록합니다. [상세](modules.md#dynamic-module-registration)
-  
-  `options`은 이전 속성을 보호하는 `preserveState: true`를 가질 수 있습니다. 이것은 서버사이드 렌더링에서 유용합니다.
-
-- **`unregisterModule(path: string | Array<string>)`**
-
-  동적 모듈을 해제 합니다. [상세](modules.md#dynamic-module-registration)
-
-- **`hotUpdate(newOptions: Object)`**
-
-  새 액션과 변이를 핫 스왑 합니다. [상세](hot-reload.md)
-
-### 컴포넌트 바인딩 헬퍼
-
-- **`mapState(namespace?: string, map: Array<string> | Object): Object`**
-
-  Vuex 저장소의 하위 트리를 반환하는 컴포넌트 계산 옵션을 만듭니다. [상세](state.md#the-mapstate-helper)
-  
-  처음 argument는 string 타입의 namespace가 될 수 있습니다. [상세](modules.md#binding-helpers-with-namespace)
-
-- **`mapGetters(namespace?: string, map: Array<string> | Object): Object`**
-
-  getter의 평가된 값을 반환하는 컴포넌트 계산 옵션을 만듭니다. [상세](getters.md#the-mapgetters-helper)
-  
-  처음 argument는 string 타입의 namespace가 될 수 있습니다. [상세](modules.md#binding-helpers-with-namespace)
-
-- **`mapActions(namespace?: string, map: Array<string> | Object): Object`**
-
-  액션을 전달하는 컴포넌트 메소드 옵션을 만듭니다. [상세](actions.md#dispatching-actions-in-components)
-  
-  처음 argument는 string 타입의 namespace가 될 수 있습니다. [상세](modules.md#binding-helpers-with-namespace)
-
-- **`mapMutations(namespace?: string, map: Array<string> | Object): Object`**
-
-  변이를 커밋하는 컴포넌트 메소드 옵션을 만듭니다. [상세](mutations.md#commiting-mutations-in-components)
-  
-  처음 argument는 string 타입의 namespace가 될 수 있습니다. [상세](modules.md#binding-helpers-with-namespace)
-  
-- **`createNamespacedHelpers(namespace: string): Object`**
-
-  namespace가 적용된 컴포넌트 바인딩 helper를 만듭니다. 주어진 namespace가 적용된 `mapState`, `mapGetters`, `mapActions` `mapMutations`들을 가지고 있는 오브젝트를 반환합니다. [상세](modules.md#binding-helpers-with-namespace)

+ 0 - 19
docs-gitbook/kr/book.json

@@ -1,19 +0,0 @@
-{
-  "gitbook": "2.x.x",
-  "plugins": ["edit-link", "prism", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Edit This Page"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 60
docs-gitbook/kr/forms.md

@@ -1,60 +0,0 @@
-# 폼 핸들링
-
-strict 모드로 Vuex를 사용하는 경우 Vuex에 포함된 부분에 `v-model`을 사용하는 것은 약간 까다로울 수 있습니다.
-
-``` html
-<input v-model="obj.message">
-```
-
-`obj`가 저장소에서 객체를 반환하는 계산된 속성이라면, 여기에있는 `v-model`은 사용자가 입력 할 때 `obj.message`를 직접 변경하려고 합니다. strict 모드에서는 Vuex 변이 처리기 내부에서 변이가 수행되지 않으므로 오류가 발생합니다.
-
-그것을 다루는 "Vuex 방식"은 `<input>`의 값을 바인딩하고 `input` 또는 `change` 이벤트에 대한 액션을 호출하는 것 입니다.
-
-``` html
-<input :value="message" @input="updateMessage">
-```
-``` js
-// ...
-computed: {
-  ...mapState({
-    message: state => state.obj.message
-  })
-},
-methods: {
-  updateMessage (e) {
-    this.$store.commit('updateMessage', e.target.value)
-  }
-}
-```
-
-변이에 대한 핸들러 입니다.
-
-``` js
-// ...
-mutations: {
-  updateMessage (state, message) {
-    state.obj.message = message
-  }
-}
-```
-
-### 양방향 계산된 속성
-
-틀림없이, 위의 내용은 `v-model` + 지역 상태보다 좀더 장황 해졌고, `v-model`의 유용한 기능 중 일부를 잃어 버렸습니다. 다른 방법은 setter를 사용하여 양방향 계산된 속성을 사용하는 것입니다.
-
-``` html
-<input v-model="message">
-```
-``` js
-// ...
-computed: {
-  message: {
-    get () {
-      return this.$store.state.obj.message
-    },
-    set (value) {
-      this.$store.commit('updateMessage', value)
-    }
-  }
-}
-```

+ 0 - 91
docs-gitbook/kr/getters.md

@@ -1,91 +0,0 @@
-# Getters
-
-때로는 저장소 상태를 기반하는 상태를 계산해야 할 수도 있습니다.(예: 아이템 리스트를 필터링하고 계산)
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.state.todos.filter(todo => todo.done).length
-  }
-}
-```
-
-둘 이상의 컴포넌트가 이를 사용 해야하는 경우 함수를 복제하거나 공유된 헬퍼를 추출하여 여러 위치에서 가져와야합니다. 둘 다 이상적이지 않습니다.
-
-Vuex를 사용하면 저장소에서 "getters"를 정의 할 수 있습니다(저장소의 계산된 속성으로 생각됩니다). Getters는 첫 번째 전달인자로 상태를 받습니다.
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    todos: [
-      { id: 1, text: '...', done: true },
-      { id: 2, text: '...', done: false }
-    ]
-  },
-  getters: {
-    doneTodos: state => {
-      return state.todos.filter(todo => todo.done)
-    }
-  }
-})
-```
-
-getters는 `store.getters` 객체에 노출 됩니다.
-
-``` js
-store.getters.doneTodos // -> [{ id: 1, text: '...', done: true }]
-```
-
-Getters는 두 번째 전달인자로 다른 getter도 받게됩니다.
-
-``` js
-getters: {
-  // ...
-  doneTodosCount: (state, getters) => {
-    return getters.doneTodos.length
-  }
-}
-```
-
-``` js
-store.getters.doneTodosCount // -> 1
-```
-
-이제 모든 컴포넌트에서 쉽게 사용할 수 있습니다.
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.getters.doneTodosCount
-  }
-}
-```
-
-### `mapGetters` 헬퍼
-
-`mapGetters` 헬퍼는 저장소 getter를 로컬 계산된 속성에 매핑합니다.
-
-``` js
-import { mapGetters } from 'vuex'
-
-export default {
-  // ...
-  computed: {
-    // getter를 객체 전개 연산자(Object Spread Operator)로 계산하여 추가합니다.
-    ...mapGetters([
-      'doneTodosCount',
-      'anotherGetter',
-      // ...
-    ])
-  }
-}
-```
-
-getter를 다른 이름으로 매핑하려면 객체를 사용합니다.
-
-``` js
-...mapGetters({
-  // this.doneCount를 store.getters.doneTodosCount에 매핑하십시오.
-  doneCount: 'doneTodosCount'
-})
-```

+ 0 - 43
docs-gitbook/kr/getting-started.md

@@ -1,43 +0,0 @@
-# 시작하기
-
-모든 Vuex 애플리케이션의 중심에는 **store** 가 있습니다. "저장소"는 기본적으로 애플리케이션 **상태** 를 보유하고있는 컨테이너입니다. Vuex 저장소가 일반 전역 개체와 두 가지 다른 점이 있습니다.
-
-1. Vuex store는 반응형 입니다. Vue 컴포넌트는 상태를 검색할 때 저장소의 상태가 변경되면 효율적으로 대응하고 업데이트합니다.
-2. 저장소의 상태를 직접 변경할 수 없습니다. 저장소의 상태를 변경하는 유일한 방법은 명시적인 **커밋을 이용한 변이** 입니다. 이렇게하면 모든 상태에 대한 추적이 가능한 기록이 남을 수 있으며 툴을 사용하여 앱을 더 잘 이해할 수 있습니다.
-
-### 가장 단순한 저장소
-
-> **참고:** 모든 예제는 ES2015 문법을 사용합니다. 사용하고 있지 않은 경우 [꼭 사용해야 합니다!](https://babeljs.io/docs/learn-es2015/)
-
-Vuex를 [설치](installation.md)한 후 저장소를 만들어 봅시다. 매우 간단합니다. 초기 상태 객체와 일부 변이를 제공하십시오.
-
-``` js
-// 모듈 시스템을 사용하는 경우 Vue.use(Vuex)를 먼저 호출해야합니다.
-
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  }
-})
-```
-
-이제 state 객체에 `store.state`로 접근하여 `store.commit` 메소드로 상태 변경을 트리거 할 수 있습니다.
-
-``` js
-store.commit('increment')
-
-console.log(store.state.count) // -> 1
-```
-
-다시 말해, `store.state.count`를 직접 변경하는 대신 변이를 수행하는 이유는 명시적으로 추적을 하기 때문입니다. 이 간단한 규칙에 따라 의도를보다 명확하게 표현할 수 있으므로 코드를 읽을 때 상태 변화를 더 잘 지켜볼 수 있습니다. 또한 모든 변이를 기록하고 상태 스냅샷을 저장하거나 시간 흐름에 따라 디버깅을 할 수 있는 도구를 제공합니다.
-
-컴포넌트 안에서 저장소 상태를 사용하는 것은 단순히 계산된 속성 내에서 상태를 반환하는 것입니다. 변경을 트리거하는 것은 컴포넌트 메소드에서 변경을 커밋하는 것을 의미합니다.
-
-다음은 [가장 기본적인 Vuex 카운터 앱](https://jsfiddle.net/n9jmu5v7/1269/)의 예입니다.
-
-이제, 우리는 각 핵심 개념에 대해 더 자세히 설명 할 것입니다. [State](state.md)부터 시작해 보겠습니다.

+ 0 - 44
docs-gitbook/kr/hot-reload.md

@@ -1,44 +0,0 @@
-# 핫 리로딩
-
-Vuex는 webpack의 [핫 모듈 변경 API](https://webpack.js.org/guides/hot-module-replacement/)를 사용하여 개발 중에 핫 리로드 변이, 모듈, 액션 및 getter를 지원합니다. [browserify-hmr](https://github.com/AgentME/browserify-hmr/) 플러그인으로 Browserify에서 사용할 수도 있습니다.
-
-변이와 모듈의 경우, `store.hotUpdate()` API 메소드를 사용할 필요가 있습니다.
-
-``` js
-// store.js
-import Vue from 'vue'
-import Vuex from 'vuex'
-import mutations from './mutations'
-import moduleA from './modules/a'
-
-Vue.use(Vuex)
-
-const state = { ... }
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  modules: {
-    a: moduleA
-  }
-})
-
-if (module.hot) {
-  // 액션과 변이를 핫 모듈로 받아 들인다.
-  module.hot.accept(['./mutations', './modules/a'], () => {
-    // 업데이트 된 모듈은 babel 6 모듈 출력으로 인해
-    // .default를 여기에 추가해야합니다.
-    const newMutations = require('./mutations').default
-    const newModuleA = require('./modules/a').default
-    // 새로운 액션과 변이로 바꿉니다.
-    store.hotUpdate({
-      mutations: newMutations,
-      modules: {
-        a: newModuleA
-      }
-    })
-  })
-}
-```
-
-[counter-hot 예제](https://github.com/vuejs/vuex/tree/dev/examples/counter-hot)로 핫 리로드를 확인하십시오.

binární
docs-gitbook/kr/images/flow.png


binární
docs-gitbook/kr/images/vuex.png


+ 0 - 51
docs-gitbook/kr/installation.md

@@ -1,51 +0,0 @@
-# 설치
-
-### 직접 다운로드 / CDN
-
-[https://unpkg.com/vuex](https://unpkg.com/vuex)
-
-<!--email_off-->
-[Unpkg.com](https://unpkg.com)은 NPM 기반 CDN 링크를 제공합니다. 위의 링크는 항상 NPM의 최신 릴리스를 가리킵니다. `https://unpkg.com/vuex@2.0.0`과 같은 URL을 통해 특정 버전/태그를 사용할 수도 있습니다.
-<!--/email_off-->
-
-Vue 뒤에 `vuex`를 추가하면 자동으로 설치됩니다:
-
-``` html
-<script src="/path/to/vue.js"></script>
-<script src="/path/to/vuex.js"></script>
-```
-
-### NPM
-
-``` bash
-npm install vuex --save
-```
-
-### Yarn
-
-``` bash
-yarn add vuex
-```
-
-모듈 시스템과 함께 사용하면 `Vue.use()`를 통해 Vuex를 명시적으로 추가해야 합니다.
-
-``` js
-import Vue from 'vue'
-import Vuex from 'vuex'
-
-Vue.use(Vuex)
-```
-
-전역 스크립트 태그를 사용할 때는 이 작업을 할 필요가 없습니다.
-
-### 개발용 빌드
-
-최신 dev 빌드를 사용하고 싶은 경우 직접 GitHub에서 클론하고 `vuex`를 직접 빌드 해야합니다.
-
-
-``` bash
-git clone https://github.com/vuejs/vuex.git node_modules/vuex
-cd node_modules/vuex
-npm install
-npm run build
-```

+ 0 - 63
docs-gitbook/kr/intro.md

@@ -1,63 +0,0 @@
-# Vuex가 무엇인가요?
-
-Vuex는 Vue.js 애플리케이션에 대한 **상태 관리 패턴 + 라이브러리** 입니다. 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며 예측 가능한 방식으로 상태를 변경할 수 있습니다. 또한 Vue의 공식 [devtools 확장 프로그램](https://github.com/vuejs/vue-devtools)과 통합되어 설정 시간이 필요 없는 디버깅 및 상태 스냅 샷 내보내기/가져오기와 같은 고급 기능을 제공합니다.
-
-### "상태 관리 패턴"이란 무엇인가요?
-
-간단한 Vue 카운터 앱부터 시작 해보겠습니다.
-
-``` js
-new Vue({
-  // 상태
-  data () {
-    return {
-      count: 0
-    }
-  },
-  // 뷰
-  template: `
-    <div>{{ count }}</div>
-  `,
-  // 액션
-  methods: {
-    increment () {
-      this.count++
-    }
-  }
-})
-```
-
-다음과 같은 기능을 가진 앱입니다.
-
-- **상태** 는 앱을 작동하는 원본 소스 입니다.
-- **뷰** 는 **상태의** 선언적 매핑입니다.
-- **액션** 은 **뷰** 에서 사용자 입력에 대해 반응적으로 상태를 바꾸는 방법입니다.
-
-이것은 "단방향 데이터 흐름" 개념의 매우 단순한 도표입니다.
-
-<p style="text-align: center; margin: 2em">
-  <img style="width:100%;max-width:450px;" src="./images/flow.png">
-</p>
-
-그러나 **공통의 상태를 공유하는 여러 컴포넌트** 가 있는 경우 단순함이 빠르게 저하됩니다.
-
-- 여러 뷰는 같은 상태에 의존합니다.
-- 서로 다른 뷰의 작업은 동일한 상태를 반영해야 할 수 있습니다.
-
-첫번째 문제의 경우, 지나치게 중첩된 컴포넌트를 통과하는 prop는 장황할 수 있으며 형제 컴포넌트에서는 작동하지 않습니다. 두번째 문제의 경우 직접 부모/자식 인스턴스를 참조하거나 이벤트를 통해 상태의 여러 복사본을 변경 및 동기화 하려는 등의 해결 방법을 사용해야 합니다. 이러한 패턴은 모두 부서지기 쉽고 유지보수가 불가능한 코드로 빠르게 변경됩니다.
-
-그렇다면 컴포넌트에서 공유된 상태를 추출하고 이를 전역 싱글톤으로 관리해야 합니다. 이를 통해 우리의 컴포넌트 트리는 커다란 "뷰"가 되며 모든 컴포넌트는 트리에 상관없이 상태에 액세스하거나 동작을 트리거 할 수 있습니다!
-
-또한 상태 관리 및 특정 규칙 적용과 관련된 개념을 정의하고 분리함으로써 코드의 구조와 유지 관리 기능을 향상시킵니다.
-
-이는 [Flux](https://facebook.github.io/flux/docs/overview), [Redux](http://redux.js.org/), [The Elm Architecture](https://guide.elm-lang.org/architecture/)에서 영감을 받은 Vuex의 기본 아이디어 입니다. 다른 패턴과 달리 Vuex는 Vue.js가 효율적인 업데이트를 위해 세분화된 반응 시스템을 활용하도록 특별히 고안된 라이브러리입니다.
-
-![vuex](./images/vuex.png)
-
-### 언제 사용해야 하나요?
-
-Vuex는 공유된 상태 관리를 처리하는 데 유용하지만, 개념에 대한 이해와 시작하는 비용도 함께 듭니다. 그것은 단기간과 장기간 생산성 간의 기회비용이 있습니다.
-
-대규모 SPA를 구축하지 않고 Vuex로 바로 뛰어 들었다면, 시간이 오래 걸리고 힘든일일 것입니다. 이것은 일반 적인 일입니다. 앱이 단순하다면 Vuex없이는 괜찮을 것입니다. 간단한 [글로벌 이벤트 버스](https://kr.vuejs.org/v2/guide/components.html#비-부모-자식간-통신)만 있으면됩니다. 그러나 중대형 규모의 SPA를 구축하는 경우 Vue컴포넌트 외부의 상태를 보다 잘 처리할 수 있는 방법을 생각하게 될 가능성이 있으며 Vuex는 자연스럽게 선택할 수 있는 단계가 될 것입니다. Redux의 저자인 Dan Abramov의 좋은 인용이 있습니다.
-
-> Flux 라이브러리는 안경과 같습니다. 필요할 때 알아볼 수 있습니다.

+ 0 - 138
docs-gitbook/kr/modules.md

@@ -1,138 +0,0 @@
-# 모듈
-
-단일 상태 트리를 사용하기 때문에 애플리케이션의 모든 상태가 하나의 큰 객체 안에 포함됩니다. 그러나 규모가 커짐에 따라 저장소는 매우 비대해질 수 있습니다.
-
-이를 위해 Vuex는 저장소를 **모듈** 로 나눌 수 있습니다. 각 모듈은 자체 상태, 변이, 액션, 게터 및 심지어 중첩된 모듈을 포함 할 수 있습니다.
-
-``` js
-const moduleA = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... },
-  getters: { ... }
-}
-
-const moduleB = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... }
-}
-
-const store = new Vuex.Store({
-  modules: {
-    a: moduleA,
-    b: moduleB
-  }
-})
-
-store.state.a // -> moduleA'의 상태
-store.state.b // -> moduleB'의 상태
-```
-
-### 지역 상태 모듈
-
-모듈의 변이와 getter 내부에서 첫 번째 전달인자는 **모듈의 지역 상태** 가됩니다.
-
-``` js
-const moduleA = {
-  state: { count: 0 },
-  mutations: {
-    increment (state) {
-      // state는 지역 모듈 상태 입니다
-      state.count++
-    }
-  },
-
-  getters: {
-    doubleCount (state) {
-      return state.count * 2
-    }
-  }
-}
-```
-
-유사하게 모듈 내부에서 `context.state`는 지역 상태를 노출시킬 것이고 루트 상태는 `context.rootState`로 노출 될 것입니다.
-
-``` js
-const moduleA = {
-  // ...
-  actions: {
-    incrementIfOddOnRootSum ({ state, commit, rootState }) {
-      if ((state.count + rootState.count) % 2 === 1) {
-        commit('increment')
-      }
-    }
-  }
-}
-```
-
-또한, 모듈 getters 내부, 루트 상태는 그들의 세 번째 전달인자로 노출됩니다.
-
-``` js
-const moduleA = {
-  // ...
-  getters: {
-    sumWithRootCount (state, getters, rootState) {
-      return state.count + rootState.count
-    }
-  }
-}
-```
-
-### 네임스페이스
-
-모듈 내의 액션, 변이 및 getter는 여전히 **전역 네임 스페이스** 아래에 등록됩니다. 여러 모듈이 동일한 변이/액션 유형에 반응 할 수 있습니다. 이름 앞에 접두사 또는 접미사를 붙이면 이름 충돌을 피하기 위해 모듈 자신의 네임스페이스를 직접 지정할 수 있습니다. 그리고 알 수 없는 환경에서 사용될 재사용 가능한 Vuex 모듈을 작성하는 경우라면 반드시 사용해야 합니다. 예를 들어,`todos` 모듈을 만들고 싶은 경우
-
-``` js
-// types.js
-
-// getter, 액션, 변이의 이름을 상수로 정의하고
-// 모듈 이름 `todos` 접두어를 붙입니다
-export const DONE_COUNT = 'todos/DONE_COUNT'
-export const FETCH_ALL = 'todos/FETCH_ALL'
-export const TOGGLE_DONE = 'todos/TOGGLE_DONE'
-```
-
-``` js
-// modules/todos.js
-import * as types from '../types'
-
-// 접두어로 된 이름을 사용하여 getter, 액션 및 변이 정의
-const todosModule = {
-  state: { todos: [] },
-
-  getters: {
-    [types.DONE_COUNT] (state) {
-      // ...
-    }
-  },
-
-  actions: {
-    [types.FETCH_ALL] (context, payload) {
-      // ...
-    }
-  },
-
-  mutations: {
-    [types.TOGGLE_DONE] (state, payload) {
-      // ...
-    }
-  }
-}
-```
-
-### 동적 모듈 등록
-
-`store.registerModule` 메소드로 저장소가 생성 된 **후에** 모듈을 등록 할 수 있습니다.
-
-``` js
-store.registerModule('myModule', {
-  // ...
-})
-```
-
-모듈의 상태는`store.state.myModule`으로 노출 됩니다.
-
-동적 모듈 등록을 사용하면 다른 Vue 플러그인도 애플리케이션의 저장소에 모듈을 연결하여 상태 관리에 Vuex를 활용할 수 있습니다. 예를 들어 [`vuex-router-sync`](https://github.com/vuejs/vuex-router-sync) 라이브러리는 동적으로 연결된 모듈에서 애플리케이션의 라우트 상태를 관리하여 vue-router와 vuex를 통합합니다.
-
-`store.unregisterModule(moduleName)`을 사용하여 동적으로 등록 된 모듈을 제거할 수도 있습니다. 이 방법으로는 정적 모듈(저장소 생성시 선언 됨)을 제거 할 수 없습니다.

+ 0 - 167
docs-gitbook/kr/mutations.md

@@ -1,167 +0,0 @@
-# 변이
-
-Vuex 저장소에서 실제로 상태를 변경하는 유일한 방법은 변이하는 것입니다. Vuex 변이는 이벤트와 매우 유사합니다. 각 변이에는 **타입** 문자열 **핸들러** 가 있습니다. 핸들러 함수는 실제 상태 수정을 하는 곳이며, 첫 번째 전달인자로 상태를받습니다.
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 1
-  },
-  mutations: {
-    increment (state) {
-      // 상태 변이
-      state.count++
-    }
-  }
-})
-```
-
-변이 핸들러를 직접 호출 할 수는 없습니다. 이 옵션은 이벤트 등록과 비슷합니다. "타입이 `increment`인 변이가 발생하면이 핸들러를 호출합니다." 변이 핸들러를 호출하려면 해당 타입과 함께 **store.commit** 을 호출해야합니다.
-
-``` js
-store.commit('increment')
-```
-
-### 페이로드를 가진 커밋
-
-변이에 대해 **payload** 라고하는 `store.commit`에 추가 전달인자를 사용 할 수 있습니다.
-
-``` js
-// ...
-mutations: {
-  increment (state, n) {
-    state.count += n
-  }
-}
-```
-``` js
-store.commit('increment', 10)
-```
-
-대부분의 경우 페이로드는 여러 필드를 포함할 수 있는 객체여야하며 기록 된 변이는 더 이해하기 쉽습니다.
-
-``` js
-// ...
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-``` js
-store.commit('increment', {
-  amount: 10
-})
-```
-
-### 객체 스타일 커밋
-
-변이를 커밋하는 또 다른 방법은 `type` 속성을 가진 객체를 직접 사용하는 것입니다.
-
-``` js
-store.commit({
-  type: 'increment',
-  amount: 10
-})
-```
-
-객체 스타일 커밋을 사용할 때 전체 객체는 변이 핸들러에 페이로드로 전달되므로 핸들러는 동일하게 유지됩니다.
-
-``` js
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-### Vue의 반응성 규칙을 따르는 변이
-
-Vuex 저장소의 상태는 Vue에 의해 반응하므로, 상태를 변경하면 상태를 관찰하는 Vue 컴포넌트가 자동으로 업데이트됩니다. 이것은 또한 Vuex 변이가 일반 Vue로 작업 할 때 동일한 반응성에 대한 경고를 받을 수 있음을 의미합니다.
-
-1. 원하는 모든 필드에 앞서 저장소를 초기화하는 것이 좋습니다.
-
-2. 객체에 새 속성을 추가할 때 다음 중 하나를 수행해야합니다.
-
-  - `Vue.set(obj, 'newProp', 123)`을 사용하거나,
-
-  - 객체를 새로운 것으로 교체하십시오. 예를 들어, 3 단계 [객체 확산 문법](https://github.com/sebmarkbage/ecmascript-rest-spread)을 사용하면 다음과 같이 작성할 수 있습니다.
-
-    ``` js
-    state.obj = { ...state.obj, newProp: 123 }
-    ```
-
-### 변이 타입에 상수 사용
-
-다양한 Flux 구현에서 변이 유형에 상수를 사용하는 것은 일반인 패턴입니다. 이를 통해 코드는 linter와 같은 툴링을 활용할 수 있으며 모든 상수를 단일 파일에 저장하면 공동 작업자가 전체 애플리케이션에서 어떤 변이가 가능한지 한눈에 파악할 수 있습니다.
-
-``` js
-// mutation-types.js
-export const SOME_MUTATION = 'SOME_MUTATION'
-```
-
-``` js
-// store.js
-import Vuex from 'vuex'
-import { SOME_MUTATION } from './mutation-types'
-
-const store = new Vuex.Store({
-  state: { ... },
-  mutations: {
-    // ES2015에서 계산 된 프로퍼티 이름 기능을 사용하여
-    // 상수를 함수 이름으로 사용할 수 있습니다
-    [SOME_MUTATION] (state) {
-      // 변이 상태
-    }
-  }
-})
-```
-
-상수를 사용할지 여부는 대부분 환경 설정입니다. 개발자가 많은 대규모 프로젝트에서 유용할 수 있지만, 이는 완전히 선택 사항입니다.
-
-### 변이는 무조건 동기적이어야 합니다.
-
-기억 해야할 한 가지 중요한 규칙은 **변이 핸들러 함수는 동기적** 이어야 한다는 것입니다. 왜 그럴까요? 다음 예제를 확인해보십시오.
-
-``` js
-mutations: {
-  someMutation (state) {
-    api.callAsyncMethod(() => {
-      state.count++
-    })
-  }
-}
-```
-
-이제 우리가 앱을 디버깅하고 devtool의 돌연변이 로그를 보고 있다고 상상해보십시오. 기록 된 모든 변이에 대해 devtool은 상태의 "이전" 및 "이후" 스냅 샷을 캡처 해야 합니다. 그러나 위의 예제 변이 내의 비동기 콜백은 불가능합니다. 변이가 커밋 되었을 때 콜백은 아직 호출되지 않으며, 콜백이 실제로 호출 될 시기를 devtool이 알 수 있는 방법이 없습니다. 콜백에서 수행 된 모든 상태 변이는 본질적으로 추적 할 수 없습니다!
-
-### 컴포넌트 안에서 변이 커밋하기
-
-`this.$store.commit('xxx')`를 사용하여 컴포넌트에서 변이를 수행하거나 컴포넌트 메소드를 `store.commit` 호출에 매핑하는 `mapMutations` 헬퍼를 사용할 수 있습니다 (루트 `store` 주입 필요)
-
-``` js
-import { mapMutations } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapMutations([
-      'increment' // this.increment()를 this.$store.commit('increment')에 매핑합니다.
-    ]),
-    ...mapMutations({
-      add: 'increment' // this.add()를 this.$store.commit('increment')에 매핑합니다.
-    })
-  }
-}
-```
-
-### 액션에서 사용
-
-비동기성이 상태의 변이와 결합하면 프로그램을 파악하기가 매우 어려워 질 수 있습니다. 예를 들어 상태를 변경하는 두 가지 비동기 콜백 메소드를 호출할 때 호출되는 시점과 먼저 호출 된 콜백을 어떻게 알 수 있습니까? 이것이 우리가 두 개념을 분리하려는 이유입니다. Vuex에서 **변이는 동기적으로 트랜잭션합니다.**
-
-``` js
-store.commit('increment')
-// "increment" 변이가 일으킬 수 있는 모든 상태 변화는 이 순간에 이루어져야합니다.
-```
-
-비동기 작업을 처리하기 위한 [액션](actions.md)를 소개합시다.

+ 0 - 126
docs-gitbook/kr/plugins.md

@@ -1,126 +0,0 @@
-# 플러그인
-
-Vuex 저장소는 각 변이에 대한 훅을 노출하는 `plugins` 옵션을 허용합니다. Vuex 플러그인은 저장소를 유일한 전달인자로 받는 함수입니다.
-
-``` js
-const myPlugin = store => {
-  // 저장소가 초기화 될 때 불립니다.
-  store.subscribe((mutation, state) => {
-    // 매 변이시마다 불립니다.
-    // 변이는 { type, payload } 포맷으로 제공됩니다.
-  })
-}
-```
-
-그리고 다음과 같이 사용할 수 있습니다.
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: [myPlugin]
-})
-```
-
-### 플러그인 내부에서 변이 커밋하기
-
-플러그인은 상태를 직접 변이할 수 없습니다. 컴포넌트와 마찬가지로 변이를 커밋하여 변경을 트리거 할 수 있습니다.
-
-변이을 커밋함으로써 플러그인을 사용하여 데이터 소스를 저장소에 동기화 할 수 있습니다. 예를 들어, websocket 데이터 소스를 저장소에 동기화하려면 (이는 사실 인위적인 예제입니다. 실제로 `createPlugin` 함수는 더 복잡한 작업을 위해 몇 가지 추가 옵션을 필요로 할 수 있습니다)
-
-``` js
-export default function createWebSocketPlugin (socket) {
-  return store => {
-    socket.on('data', data => {
-      store.commit('receiveData', data)
-    })
-    store.subscribe(mutation => {
-      if (mutation.type === 'UPDATE_DATA') {
-        socket.emit('update', mutation.payload)
-      }
-    })
-  }
-}
-```
-
-``` js
-const plugin = createWebSocketPlugin(socket)
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  plugins: [plugin]
-})
-```
-
-### 상태 스냅샷 가져오기
-
-때로는 플러그인이 상태의 "스냅샷"을 얻고자 할 수 있으며, 또한 변이 이후 상태와 변이 이전 상태를 비교할 수 있습니다. 이를 달성하기 위해서는 상태 객체에 대한 깊은 복사를 수행해야합니다 :
-
-``` js
-const myPluginWithSnapshot = store => {
-  let prevState = _.cloneDeep(store.state)
-  store.subscribe((mutation, state) => {
-    let nextState = _.cloneDeep(state)
-
-    // prevState와 nextState를 비교하십시오.
-
-    // 다음 변이를 위한 상태 저장
-    prevState = nextState
-  })
-}
-```
-
-**상태 스냅 샷을 사용하는 플러그인은 개발 중에 만 사용해야합니다.** webpack 또는 Browserify를 사용하는 경우 빌드 도구가 이를 처리 할 수 있습니다.
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: process.env.NODE_ENV !== 'production'
-    ? [myPluginWithSnapshot]
-    : []
-})
-```
-
-플러그인은 기본적으로 사용됩니다. 배포를 위해서는 webpack의 [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) 또는 [envify](https://github.com/hughsk/envify)가 필요합니다. Browserify가 `process.env.NODE_ENV !== 'production'`의 값을 최종 빌드를 위해 `false`로 변환합니다.
-
-
-### 내장 로거 플러그인
-
-> [vue-devtools](https://github.com/vuejs/vue-devtools)를 사용하고 있으면 필요 없을 수 있습니다.
-
-Vuex에는 일반적인 디버깅을 위한 로거 플러그인이 함께 제공됩니다.
-
-``` js
-import createLogger from 'vuex/dist/logger'
-
-const store = new Vuex.Store({
-  plugins: [createLogger()]
-})
-```
-
-`createLogger` 함수는 몇 가지 옵션을 가질 수 있습니다.
-
-``` js
-const logger = createLogger({
-  collapsed: false, // 로그를 가지는 변이 자동 확장
-  filter (mutation, stateBefore, stateAfter) {
-    // returns true if a mutation should be logged
-    // `mutation` is a { type, payload }
-    return mutation.type !== "aBlacklistedMutation"
-  },
-  transformer (state) {
-    // 로깅하기전 상태를 변이 하십시오.
-    // 예를 들어 특정 하위 트리만 반환합니다.
-    return state.subTree
-  },
-  mutationTransformer (mutation) {
-    // 변이는 { type, payload }의 포맷으로 기록됩니다.
-    // 원하는 포맷으로 변경할 수 있습니다.
-    return mutation.type
-  }
-})
-```
-
-로거 파일은`<script>`태그를 통해 직접 포함될 수 있으며 `createVuexLogger` 함수를 전역적으로 노출합니다.
-
-로거 플러그인은 상태 스냅샷을 사용하므로 개발용으로만 사용하십시오.

+ 0 - 109
docs-gitbook/kr/state.md

@@ -1,109 +0,0 @@
-# 상태
-
-### 단일 상태 트리
-
-Vuex는 **단일 상태 트리** 를 사용합니다. 즉, 이 단일 객체는 모든 애플리케이션 수준의 상태를 포함하며 "원본 소스" 역할을 합니다. 이는 각 애플리케이션마다 하나의 저장소만 갖게 된다는 것을 의미합니다. 단일 상태 트리를 사용하면 특정 상태를 쉽게 찾을 수 있으므로 디버깅을 위해 현재 앱 상태의 스냅 샷을 쉽게 가져올 수 있습니다.
-
-단일 상태 트리는 모듈성과 충돌하지 않습니다. 나중에 상태와 변이를 하위 모듈로 분할하는 방법에 대해 설명합니다.
-
-### Vuex 상태를 Vue 컴포넌트에서 가져오기
-
-그러면 Vue 컴포넌트에서 저장소 내부의 상태를 어떻게 표시하나요? Vuex 저장소는 반응적이기 때문에 저장소에서 상태를 "검색"하는 가장 간단한 방법은 [계산된 속성](http://kr.vuejs.org/guide/computed.html)내에서 일부 저장소 상태를 가져오는 것입니다.
-
-``` js
-// Counter 컴포넌트를 만듭니다
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return store.state.count
-    }
-  }
-}
-```
-
-`store.state.count`가 변경되면 계산된 속성이 다시 변경되고 관련 DOM 업데이트가 트리거됩니다.
-
-그러나 이 패턴은 컴포넌트가 전역 저장소 단독 항목에 의존하게합니다. 모듈 시스템을 사용할 때는 저장소 상태를 사용하는 모든 컴포넌트에서 저장소를 가져와야하며 컴포넌트를 테스트 할 때는 가짜데이터가 필요합니다.
-
-Vuex는 `store` 옵션(`Vue.use(Vuex)`에 의해 가능)으로 루트 컴포넌트의 모든 자식 컴포넌트에 저장소를 "주입"하는 메커니즘을 제공합니다.
-
-``` js
-const app = new Vue({
-  el: '#app',
-  // "store" 옵션을 사용하여 저장소를 제공하십시오.
-  // 그러면 모든 하위 컴포넌트에 저장소 인스턴스가 삽입됩니다.
-  store,
-  components: { Counter },
-  template: `
-    <div class="app">
-      <counter></counter>
-    </div>
-  `
-})
-```
-
-루트 인스턴스에 `store` 옵션을 제공함으로써 저장소는 루트의 모든 하위 컴포넌트에 주입되고 `this.$store`로 사용할 수 있습니다. `Counter` 구현을 수정해야 합니다.
-
-``` js
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return this.$store.state.count
-    }
-  }
-}
-```
-
-### `mapState` 헬퍼
-
-컴포넌트가 여러 저장소 상태 속성이나 getter를 사용해야하는 경우 계산된 속성을 모두 선언하면 반복적이고 장황해집니다. 이를 처리하기 위해 우리는 계산된 getter 함수를 생성하는 `mapState` 헬퍼를 사용하여 키 입력을 줄일 수 있습니다.
-
-``` js
-// 독립 실행 형 빌드에서 헬퍼가 Vuex.mapState로 노출됩니다.
-import { mapState } from 'vuex'
-
-export default {
-  // ...
-  computed: mapState({
-    // 화살표 함수는 코드를 매우 간결하게 만들어 줍니다!
-    count: state => state.count,
-
-    // 문자열 값 'count'를 전달하는 것은 `state => state.count`와 같습니다.
-    countAlias: 'count',
-
-    // `this`를 사용하여 로컬 상태에 액세스하려면 일반적인 함수를 사용해야합니다
-    countPlusLocalState (state) {
-      return state.count + this.localCount
-    }
-  })
-}
-```
-
-또한 매핑 된 계산된 속성의 이름이 상태 하위 트리 이름과 같을 때 문자열 배열을 `mapState`에 전달할 수 있습니다.
-
-``` js
-computed: mapState([
-  // this.count를 store.state.count에 매핑 합니다.
-  'count'
-])
-```
-
-### 객체 전개 연산자 (Object Spread Operator)
-
-`mapState`는 객체를 반환합니다. 다른 로컬 영역의 계산된 속성과 함께 사용하려면 어떻게 해야 하나요? 일반적으로, 최종 객체를 `computed`에 전달할 수 있도록 여러 객체를 하나로 병합하는 유틸리티를 사용해야합니다. 그러나 (3 단계 ECMAScript 스펙) [객체 전개 연산자 (Object Spread Operator)](https://github.com/sebmarkbage/ecmascript-rest-spread)을 사용하면 문법을 매우 단순화 할 수 있습니다.
-
-``` js
-computed: {
-  localComputed () { /* ... */ },
-  // 이것을 객체 전개 연산자(Object Spread Operator)를 사용하여 외부 객체에 추가 하십시오.
-  ...mapState({
-    // ...
-  })
-}
-```
-
-### 컴포넌트에는 여전히 로컬 상태가 있을 수 있습니다.
-
-Vuex를 사용한다고해서 Vuex에 **모든** 상태를 넣어야하는 것은 아닙니다. Vuex에 더 많은 상태를 넣으면 상태 변이가 더 명확하고 디버그 가능하지만, 때로는 코드를 보다 장황하고 간접적으로 만들 수 있습니다. 상태 조각이 단일 컴포넌트에 엄격하게 속한 경우 로컬 상태로 남겨 둘 수 있습니다. 기회비용을 판단하고 앱의 개발 요구에 맞는 결정을 내려야 합니다.

+ 0 - 25
docs-gitbook/kr/strict.md

@@ -1,25 +0,0 @@
-# Strict 모드
-
-strict 모드를 사용하기 위해, `strict: true`를 Vuex 저장소를 만들 때 추가하면 됩니다.
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: true
-})
-```
-
-엄격 모드에서는 Vuex 상태가 변이 핸들러 외부에서 변이 될 때 마다 오류가 발생합니다. 이렇게하면 디버깅 도구로 모든 상태 변이를 명시적으로 추적 할 수 있습니다.
-
-### 개발 vs. 배포
-
-**배포시 strict 모드를 켜지 마십시오!**  Strict 모드는 부적절한 변이를 감지하기 위해 상태 트리를 자세히 관찰합니다. 성능 이슈를 피하기 위해 배포 환경에서 이를 해제 하십시오.
-
-플러그인과 마찬가지로 빌드 도구가 다음을 처리하도록 할 수 있습니다.
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: process.env.NODE_ENV !== 'production'
-})
-```

+ 0 - 33
docs-gitbook/kr/structure.md

@@ -1,33 +0,0 @@
-# 애플리케이션 구조
-
-실제로 Vuex는 코드 구조를 제한하지는 않습니다. 이보다 아래에 있는 상위 수준 원칙을 강요합니다.
-
-1. 애플리케이션 레벨의 상태는 중앙 집중된 저장소 입니다.
-
-2. 상태를 변경시키는 유일한 방법은 동기 트랜잭션인 **변이** 를 커밋하는 것입니다.
-
-3. 비동기식 로직은 캡슐화되어야하며 **액션** 으로 구성 됩니다.
-
-
-이 규칙을 따른다면 프로젝트를 구조화하는 것은 사용자에게 달려 있습니다. 저장소 파일이 너무 커지면 액션, 돌연변이 및 getter를 개별 파일로 분할하기만 하면됩니다.
-
-중요한 앱의 경우 모듈을 활용해야 할 가능성이 높습니다. 다음은 프로젝트 구조의 예입니다.
-
-``` bash
-├── index.html
-├── main.js
-├── api
-│   └── ... # API 요청을 위한 추상화를 포함합니다.
-├── components
-│   ├── App.vue
-│   └── ...
-└── store
-    ├── index.js          # 모듈을 조합하고 저장소를 내보내는 곳 입니다.
-    ├── actions.js        # 루트 액션
-    ├── mutations.js      # 루트 변이
-    └── modules
-        ├── cart.js       # cart 모듈
-        └── products.js   # products 모듈
-```
-
-참고 사항으로, [장바구니 예](https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart)를 확인하십시오.

+ 0 - 222
docs-gitbook/kr/testing.md

@@ -1,222 +0,0 @@
-# 테스팅
-
-Vuex에서 단위 테스트를 하고자 하는 주요 부분은 변이와 액션입니다.
-
-### 변이 테스팅
-
-변이는 테스트하기 매우 간단합니다. 왜냐하면 변이는 전달인자에 완전히 의존하는 함수이기 때문입니다. 한 가지 트릭은 ES2015 모듈을 사용하고 `store.js` 파일에 변이를 넣는다면 기본 내보내기와 함께 변이를 명명된 내보내기로 내보낼 수 있다는 것입니다.
-
-``` js
-const state = { ... }
-
-// 변이를 이름을 가지는 내보내기를 이용하여 내보냅니다.
-export const mutations = { ... }
-
-export default new Vuex.Store({
-  state,
-  mutations
-})
-```
-
-Mocha + Chai를 사용하여 변이를 테스팅 하는 예(원하는 프레임워크/assertion 라이브러리를 사용할 수 있습니다.)
-
-``` js
-// mutations.js
-export const mutations = {
-  increment: state => state.count++
-}
-```
-
-``` js
-// mutations.spec.js
-import { expect } from 'chai'
-import { mutations } from './store'
-
-// 변이 가져오기
-const { increment } = mutations
-
-describe('mutations', () => {
-  it('INCREMENT', () => {
-    // mock 상태
-    const state = { count: 0 }
-    // 변이 적용
-    increment(state)
-    // 결과 확인
-    expect(state.count).to.equal(1)
-  })
-})
-```
-
-### 액션 테스팅
-
-액션은 외부 API를 호출 할 수 있기 때문에 좀 더 까다로울 수 있습니다. 액션을 테스트 할 때 우리는 일반적으로 조작을 어느 정도 해야합니다. 예를 들어 API 호출을 서비스로 추상화하고 테스트 내에서 해당 서비스를 조작 할 수 있습니다. 의존성을 쉽게 모방하기 위해 webpack과 [inject-loader](https://github.com/plasticine/inject-loader)를 사용하여 테스트 파일을 묶을 수 있습니다.
-
-비동기 액션 테스트 예제:
-
-``` js
-// actions.js
-import shop from '../api/shop'
-
-export const getAllProducts = ({ commit }) => {
-  commit('REQUEST_PRODUCTS')
-  shop.getProducts(products => {
-    commit('RECEIVE_PRODUCTS', products)
-  })
-}
-```
-
-``` js
-// actions.spec.js
-
-// 인라인 로더에는 require 구문을 사용하십시오.
-// inject-loader를 사용하면 조작된 의존성을
-// 주입 할 수있는 모듈 팩토리가 반환됩니다.
-import { expect } from 'chai'
-const actionsInjector = require('inject-loader!./actions')
-
-// 조작된 모의 응답과 함께 모듈 생성
-const actions = actionsInjector({
-  '../api/shop': {
-    getProducts (cb) {
-      setTimeout(() => {
-        cb([ /* 모의 응답 */ ])
-      }, 100)
-    }
-  }
-})
-
-// 예상되는 변이와 함께 테스팅 액션을 도와주는 헬퍼
-const testAction = (action, payload, state, expectedMutations, done) => {
-  let count = 0
-
-  // 모의 커밋
-  const commit = (type, payload) => {
-    const mutation = expectedMutations[count]
-
-    try {
-      expect(type).to.equal(mutation.type)
-      if (payload) {
-        expect(payload).to.deep.equal(mutation.payload)
-      }
-    } catch (error) {
-      done(error)
-    }
-
-    count++
-    if (count >= expectedMutations.length) {
-      done()
-    }
-  }
-
-  // 모의 저장소와 전달인자로 액션을 부릅니다.
-  action({ commit, state }, payload)
-
-  // 디스패치된 변이가 없는지 확인
-  if (expectedMutations.length === 0) {
-    expect(count).to.equal(0)
-    done()
-  }
-}
-
-describe('actions', () => {
-  it('getAllProducts', done => {
-    testAction(actions.getAllProducts, null, {}, [
-      { type: 'REQUEST_PRODUCTS' },
-      { type: 'RECEIVE_PRODUCTS', payload: { /* 모의 응답 */ } }
-    ], done)
-  })
-})
-```
-
-### Getters 테스팅
-
-Getter에 복잡한 연산이 있는 경우 테스트하는 것이 좋습니다. Getter는 변이와 같은 이유로 테스트하는 것이 매우 간단합니다.
-
-getter 테스팅 예제:
-
-``` js
-// getters.js
-export const getters = {
-  filteredProducts (state, { filterCategory }) {
-    return state.products.filter(product => {
-      return product.category === filterCategory
-    })
-  }
-}
-```
-
-``` js
-// getters.spec.js
-import { expect } from 'chai'
-import { getters } from './getters'
-
-describe('getters', () => {
-  it('filteredProducts', () => {
-    // mock state
-    const state = {
-      products: [
-        { id: 1, title: 'Apple', category: 'fruit' },
-        { id: 2, title: 'Orange', category: 'fruit' },
-        { id: 3, title: 'Carrot', category: 'vegetable' }
-      ]
-    }
-    // 모의 getter
-    const filterCategory = 'fruit'
-
-    // getter로 부터 결과를 받습니다
-    const result = getters.filteredProducts(state, { filterCategory })
-
-    // 결과 테스트
-    expect(result).to.deep.equal([
-      { id: 1, title: 'Apple', category: 'fruit' },
-      { id: 2, title: 'Orange', category: 'fruit' }
-    ])
-  })
-})
-```
-
-### 테스트 실행
-
-변이와 액션이 제대로 작성되면 적절한 모의 조작을 한 후 브라우저 API에 직접적인 의존성이 없어야합니다. 따라서 webpack을 사용하여 테스트를 번들로 묶어 Node를 이용해 직접 실행할 수 있습니다. 또는, `mocha-loader` 나 Karma + `karma-webpack`을 사용하여 실제 브라우저에서 테스트를 실행할 수 있습니다.
-
-#### Node를 이용한 실행
-
-다음과 같이 webpack 설정을 하십시오 ([`.babelrc`](https://babeljs.io/docs/usage/babelrc/)도 함께 필요 합니다.)
-
-``` js
-// webpack.config.js
-module.exports = {
-  entry: './test.js',
-  output: {
-    path: __dirname,
-    filename: 'test-bundle.js'
-  },
-  module: {
-    loaders: [
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/
-      }
-    ]
-  }
-}
-```
-
-이제,
-
-``` bash
-webpack
-mocha test-bundle.js
-```
-
-#### 브라우저에서 테스팅
-
-1. `mocha-loader`를 설치하세요.
-2. webpack 설정에서 `entry`를 `'mocha!babel!./test.js'`로 변경하세요.
-3. 설정을 이용하여 `webpack-dev-server`를 실행하세요.
-4. `localhost:8080/webpack-dev-server/test-bundle`로 가세요.
-
-#### 브라우저와 Karma + karma-webpack을 이용한 테스팅
-
-[vue-loader 문서](http://vue-loader.vuejs.org/en/workflow/testing.html)를 확인하세요.

+ 0 - 8
docs-gitbook/old/README.md

@@ -1,8 +0,0 @@
-# Vuex 1.0 Docs
-
-- [English](https://github.com/vuejs/vuex/tree/1.0/docs/en)
-- [Chinese](https://github.com/vuejs/vuex/tree/1.0/docs/zh-cn)
-- [Japanese](https://github.com/vuejs/vuex/tree/1.0/docs/ja)
-- [Spanish](https://github.com/vuejs/vuex/tree/1.0/docs/es)
-- [Portuguese](https://github.com/vuejs/vuex/tree/1.0/docs/pt)
-- [Italian](https://github.com/vuejs/vuex/tree/1.0/docs/it)

+ 0 - 0
docs-gitbook/old/SUMMARY.md


+ 0 - 1
docs-gitbook/pt-br/README.md

@@ -1 +0,0 @@
-{% include "./SUMMARY.md" %}

+ 0 - 21
docs-gitbook/pt-br/SUMMARY.md

@@ -1,21 +0,0 @@
-# Vuex
-
-> Nota: para os usuários TypeScript, vuex@3.0+ requer vue@2.5+ e vice-versa.
-
-- [Notas de versão](https://github.com/vuejs/vuex/releases)
-- [Instalação](installation.md)
-- [O que é Vuex?](intro.md)
-- [Começando](getting-started.md)
-- [Conceitos do núcleo](core-concepts.md)
-  - [Estado](state.md)
-  - [Getters](getters.md)
-  - [Mutações](mutations.md)
-  - [Ações](actions.md)
-  - [Módulos](modules.md)
-- [Estrutura da Aplicação](structure.md)
-- [Plugins](plugins.md)
-- [Modo estrito](strict.md)
-- [Manipulação de formulários](forms.md)
-- [Teste](testing.md)
-- [Hot Reload](hot-reload.md)
-- [Referência da API](api.md)

+ 0 - 177
docs-gitbook/pt-br/actions.md

@@ -1,177 +0,0 @@
-# Ações
-
-As ações são semelhantes às mutações, as diferenças são as seguintes:
- - Em vez de mudar o estado, as ações confirmam mutações.
- - As ações podem conter operações assíncronas arbitrárias.
-Vamos registrar uma simples ação:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  },
-  actions: {
-    increment (context) {
-      context.commit('increment')
-    }
-  }
-})
-```
-
-Os manipuladores de ação recebem um objeto de contexto que expõe o mesmo conjunto de métodos / propriedades na instância do _store_, para que você possa chamar `context.commit` para confirmar uma mutação ou acessar o estado e os _getters_ através do `context.state` e do `contexto.getters`.
-Veremos por que esse objeto de contexto não é a própria instância do _store_ quando apresentamos [Módulos](modules.md) mais tarde.
-
-Na prática, muitas vezes usamos ES2015 [desestruturação de argumentos](https://github.com/lukehoban/es6features#destructuring) para simplificar um pouco o código (especialmente quando precisamos usar _commit_ várias vezes):
-
-``` js
-actions: {
-  increment ({ commit }) {
-    commit('increment')
-  }
-}
-```
-
-### Ações de Despacho
-
-As ações são acionadas com o método `store.dispatch`:
-
-``` js
-store.dispatch('increment')
-```
-
-Isso pode parecer óbvio à primeira vista: se quisermos incrementar a contagem, por que não chamamos `store.commit('increment')` diretamente? Você se lembra que **as mutações devem ser síncronas**? As ações não. Podemos executar **operações assíncronas** dentro de uma ação:
-
-``` js
-actions: {
-  incrementAsync ({ commit }) {
-    setTimeout(() => {
-      commit('increment')
-    }, 1000)
-  }
-}
-```
-
-As ações suportam o mesmo formato de carga útil e despacho de estilo de objeto:
-
-``` js
-// dispatch com payload
-store.dispatch('incrementAsync', {
-  amount: 10
-})
-
-// dispatch com objeto
-store.dispatch({
-  type: 'incrementAsync',
-  amount: 10
-})
-```
-
-Um exemplo mais prático de ações reais seria uma ação para fazer _check-out_ de um carrinho de compras, que envolve **chamar uma API assíncrona** e **confirmar múltiplas mutações**:
-
-``` js
-actions: {
-  checkout ({ commit, state }, products) {
-    // salva os itens que estão no carrinho
-    const savedCartItems = [...state.cart.added]
-    // enviar solicitação de checkout
-    // limpa o carrinho
-    commit(types.CHECKOUT_REQUEST)
-    // a API do store aceita um callback bem-sucedido e um callback com falha
-    shop.buyProducts(
-      products,
-      // callback em caso de sucesso
-      () => commit(types.CHECKOUT_SUCCESS),
-      // callback em caso de falha
-      () => commit(types.CHECKOUT_FAILURE, savedCartItems)
-    )
-  }
-}
-```
-
-Observe que estamos realizando um fluxo de operações assíncronas e gravando os efeitos colaterais (mutações de estado) da ação confirmando-os.
-
-### Ações de Despacho em Componentes
-
-Você pode despachar ações em componentes com `this.$store.dispatch('xxx')`, ou usar o auxiliar `mapActions` que mapeia métodos de componente para chamadas do `store.dispatch` (esta ação requer injeção do `store` na instância raiz):
-
-``` js
-import { mapActions } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapActions([
-      'increment', // mapeia `this.increment()` para `this.$store.dispatch('increment')`
-
-      // `mapActions` também suporta payloads:
-      'incrementBy' // mapeia `this.incrementBy(amount)` para `this.$store.dispatch('incrementBy', amount)`
-    ]),
-    ...mapActions({
-      add: 'increment' // mapeia `this.add()` para `this.$store.dispatch('increment')`
-    })
-  }
-}
-```
-
-### Composição de ações
-
-As ações geralmente são assíncronas, então, como sabemos quando uma ação é realizada? E, o mais importante, como podemos compor ações múltiplas em conjunto para lidar com fluxos assíncronos mais complexos?
-
-A primeira coisa a saber é que o `store.dispatch` pode manipular o Promise retornado pelo manipulador de ação acionado e também retorna Promise:
-
-``` js
-actions: {
-  actionA ({ commit }) {
-    return new Promise((resolve, reject) => {
-      setTimeout(() => {
-        commit('someMutation')
-        resolve()
-      }, 1000)
-    })
-  }
-}
-```
-
-Agora, é possivel:
-
-``` js
-store.dispatch('actionA').then(() => {
-  // ...
-})
-```
-
-E em outra ação também:
-
-``` js
-actions: {
-  // ...
-  actionB ({ dispatch, commit }) {
-    return dispatch('actionA').then(() => {
-      commit('someOtherMutation')
-    })
-  }
-}
-```
-
-Por fim, se usarmos [async / await](https://tc39.github.io/ecmascript-asyncawait/), podemos compor nossas ações como esta:
-
-``` js
-// Assumindo que `getData ()` e `getOtherData ()` retornam Promessas
-
-actions: {
-  async actionA ({ commit }) {
-    commit('gotData', await getData())
-  },
-  async actionB ({ dispatch, commit }) {
-    await dispatch('actionA') // esperar que `actionA` termine
-    commit('gotOtherData', await getOtherData())
-  }
-}
-```
-
-> É possível para um `store.dispatch` desencadear vários manipuladores de ação em diferentes módulos. Neste caso, o valor retornado será uma Promise que resolve quando todos os manipuladores desencadeados foram resolvidos.

+ 0 - 217
docs-gitbook/pt-br/api.md

@@ -1,217 +0,0 @@
-# Referência de Api
-
-### Vuex.Store
-
-``` js
-import Vuex from 'vuex'
-
-const store = new Vuex.Store({ ...options })
-```
-
-### Vuex.Store Opções do Construtor
-
-- **state**
-
-  - type: `Object | Function`
-
-    O objeto raiz de estado para o _store_ Vuex. [Detalhes](state.md)
-
-    Se você passar uma função que retorna um objeto, o objeto retornado é usado como o estado da raiz. Isso é útil quando você deseja reutilizar o objeto de estado, especialmente para reutilização de módulos. [Detalhes](modules.md#reutilização-do-módulo)
-
-- **mutações**
-
-  - type: `{ [type: string]: Function }`
-
-    Registra mutações no _store_. A função do manipulador sempre recebe `estado` como o 1º argumento (será o estado local do módulo se definido em um módulo) e receberá um 2º argumento `payload` se houver um.
-
-    [Detalhes](mutations.md)
-
-- **ações**
-
-  - type: `{ [type: string]: Function }`
-
-    Registra ações no _store_. A função do manipulador recebe um objeto `context` que expõe as seguintes propriedades:
-    ``` js
-    {
-      state,      // o mesmo que `store.state`, ou estado local se estiver em módulos
-      rootState,  // o mesmo que `store.state`, apenas em módulos
-      commit,     // o mesmo que `store.commit`
-      dispatch,   // o mesmo que `store.dispatch`
-      getters,    // o mesmo que `store.getters`, ou com getters locais se estiver em módulos
-      rootGetters // o mesmo que `store.getters`, apenas em módulos
-    }
-    ```
-
-    [Detalhes](actions.md)
-
-- **_getters_**
-
-  - type: `{ [key: string]: Function }`
-
-    Registra _getters_ no _store_. A função _getter_ recebe os seguintes argumentos:
-    ```
-    state,     // será o estado local do módulo, se definido em um módulo.
-    getters    // o mesmo que `store.getters`
-    ```
-
-    Especifique quando definido em um módulo
-
-    ```
-    state,       // será o estado local do módulo, se definido em um módulo.
-
-    getters,     // Módulo getters locais do módulo atual
-    rootState,   // estado global
-    rootGetters  // todos os getters
-    ```
-
-    Os _getters_ registrados estão expostos em `store.getters`.
-
-    [Detalhes](getters.md)
-
-- **módulos**
-
-  - type: `Object`
-
-    Um objeto contendo sub módulos a serem incorporados no _store_, de forma que:
-    ``` js
-    {
-      key: {
-        state,
-        namespaced?,
-        mutations?,
-        actions?,
-        getters?,
-        modules?
-      },
-      ...
-    }
-    ```
-
-    Cada módulo pode conter "estado" e "mutações" semelhantes às opções raiz. O estado de um módulo será anexado ao estado da raiz do _store_ usando a chave do módulo. As mutações e _getters_ de um módulo receberão apenas o estado local do módulo como o 1º argumento em vez do estado da raiz e as ações do módulo `context.state` também apontarão para o estado local.
-
-    [Detalhes](modules.md)
-
-- **plugins**
-
-  - type: `Array<Function>`
-
-	Um array de funções de plugin a serem aplicadas no _store_. O plugin simplesmente recebe o _store_ como o único argumento e pode ouvir mutações (para persistência de dados de saída, log ou depuração) ou mutações de despacho (para dados de entrada, por exemplo, websockets ou observáveis).
-
-    [Detalhes](plugins.md)
-
-- **strict**
-
-  - type: `Boolean`
-  - default: `false`
-
-    Força o _store_ Vuex em modo estrito. No modo estrito, qualquer mutação ao estado do Vuex fora dos manipuladores de mutação acusará um erro.
-
-    [Detalhes](strict.md)
-
-### Vuex.Store Propriedades da instância
-
-- **_state_**
-
-  - type: `Object`
-
-    O estado raiz. Apenas leitura.
-
-- **_getters_**
-
-  - type: `Object`
-
-    Expõe os _getters_ registrados. Apenas leitura.
-
-### Vuex.Store Métodos da Instância
-
-- **`commit(type: string, payload?: any, options?: Object) | commit(mutation: Object, options?: Object)`**
-
-  Confirma uma mutação. `options` pode ter `root: true` que permite confirmar mutações da raiz em [módulos namespaced](modules.md#namespacing). [Detalhes](mutations.md)
-
-- **`dispatch(type: string, payload?: any, options?: Object) | dispatch(action: Object, options?: Object)`**
-
-  Despacha uma ação. `options` pode ter `root: true` que permite enviar ações para raiz em [módulos namespaced](modules.md#namespacing). Retorna Promise que resolve todos os manipuladores de ação acionados. [Detalhes](actions.md)
-
-- **`replaceState(state: Object)`**
-
-  Substitua o estado da raiz do _store_. Use isso apenas para fins de _hydration_ / _time-travel_.
-
-- **`watch(getter: Function, cb: Function, options?: Object)`**
-
-  Visualiza de forma reativa um valor de retorno da função _getter_ e chama o callback para o retorno de chamada quando o valor mudar. O _getter_ recebe o estado do _store_ como o 1º argumento e os _getters_ como o 2º argumento. Aceita um objeto de opções opcional que leva as mesmas opções que o método `vm. $ Watch` do Vue.
-
-  Para parar de visualizar, chame para a função do manipulador retornada.
-
-- **`subscribe(handler: Function)`**
-
-  Assina as mutações do _store_. O `handler` é chamado após cada mutação e recebe o descritor de mutação e o estado pós-mutação como argumentos:
-
-  ``` js
-  store.subscribe((mutation, state) => {
-    console.log(mutation.type)
-    console.log(mutation.payload)
-  })
-  ```
-
-  Usado com mais frequência em plugins. [Detalhes](plugins.md)
-
-- **`subscribeAction(handler: Function)`**
-
-  > Novo em 2.5.0
-
-  Assina as ações do _store_. O `handler` é chamado para cada ação despachada e recebe o descritor de ação e o estado atual do _store_ como argumentos:
-
-  ``` js
-  store.subscribeAction((action, state) => {
-    console.log(action.type)
-    console.log(action.payload)
-  })
-  ```
-
-  Usado com mais frequência em plugins. [Detalhes](plugins.md)
-
-- **`registerModule(path: string | Array<string>, module: Module, options?: Object)`**
-
-  Registra um módulo dinâmico. [Detalhes](modules.md#registro-de-módulo-dinâmico)
-
-  `options` pode ter `preserveState: true` que permite preservar o estado anterior. Util para renderização server-side.
-
-- **`unregisterModule(path: string | Array<string>)`**
-
-  Cancela o registro de um módulo dinâmico. [Detalhes](modules.md#registro-de-módulo-dinâmico)
-
-- **`hotUpdate(newOptions: Object)`**
-
-  Faz Hot swap de novas ações e mutações. [Detalhes](hot-reload.md)
-
-### Métodos Auxiliares dos Componentes
-
-- **`mapState(namespace?: string, map: Array<string> | Object): Object`**
-
-  Cria componentes computadas de opções que retornam a subárvore do _store_ Vuex. [Detalhes](state.md#o-auxiliar-mapstate)
-
-  O 1º argumento pode ser opcionalmente uma _String_ com _namespace_. [Detalhes](modules.md#usando-métodos-auxiliares-com-namespace)
-
-- **`mapGetters(namespace?: string, map: Array<string> | Object): Object`**
-
-  Criar opções computadas do componente que retornam o valor avaliado de um _getter_. [Detalhes](getters.md#o-auxiliar-mapgetters)
-
-  O 1º argumento pode ser opcionalmente uma _String_ com _namespace_. [Detalhes](modules.md#usando-métodos-auxiliares-com-namespace)
-
-- **`mapActions(namespace?: string, map: Array<string> | Object): Object`**
-
-  Cria um componente com métodos e opções que despacham uma ação.
-
-[Detalhes](actions.md#ações-de-despacho-em-componentes)
-
-  O 1º argumento pode ser opcionalmente uma _String_ com _namespace_. [Detalhes](modules.md#usando-métodos-auxiliares-com-namespace)
-
-- **`mapMutations(namespace?: string, map: Array<string> | Object): Object`**
-
-  Cria um componente com métodos e opções que confirmam uma mutação. [Detalhes](mutations.md#fazendo-commit-de-mutações-em-componente)
-
-  O 1º argumento pode ser opcionalmente uma _String_ com _namespace_. [Detalhes](modules.md#usando-métodos-auxiliares-com-namespace)
-
-- **`createNamespacedHelpers(namespace: string): Object`**
-
-  Cria um componente _namespaced_ dos métodos auxiliares. O objeto retornado possui _mapState_, _mapGetters_, _mapActions_ e _mapMutations_, que estão conectados com o dado _namespace_. [Detalhes](modules.md#usando-métodos-auxiliares-com-namespace)

+ 0 - 19
docs-gitbook/pt-br/book.json

@@ -1,19 +0,0 @@
-{
-  "gitbook": "2.x.x",
-  "plugins": ["edit-link", "prism", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Edite esta página"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 12
docs-gitbook/pt-br/core-concepts.md

@@ -1,12 +0,0 @@
-# Conceitos básicos
-
-Vamos aprender os conceitos básicos do Vuex nestes capítulos. São eles:
-  - [Estado](state.md)
-  - [Getters](getters.md)
-  - [Mutações](mutations.md)
-  - [Ações](actions.md)
-  - [Módulos](modules.md)
-
-Uma compreensão profunda de todos esses conceitos é essencial para o uso de vuex.
-Vamos começar.
-

+ 0 - 56
docs-gitbook/pt-br/forms.md

@@ -1,56 +0,0 @@
-# Manipulação de formulários
-
-Ao usar o Vuex no modo estrito, pode ser um pouco complicado usar `v-model` em um pedaço de estado que pertence ao Vuex:
-``` html
-<input v-model="obj.message">
-```
-
-Assumindo que `obj` é um dado computado que retorna um objeto do _store_, o `v-model` aqui tentará mutar diretamente `obj.message` quando o usuário digitar a entrada. No modo estrito, isso resultará em um erro porque a mutação não é realizada dentro de um manipulador de mutação Vuex explícito.
-O "modo Vuex" para lidar com isso é vinculando o valor do(s) `<input>`'s e chamar uma ação no evento `input` ou `change`:
-``` html
-<input :value="message" @input="updateMessage">
-```
-``` js
-// ...
-computed: {
-  ...mapState({
-    message: state => state.obj.message
-  })
-},
-methods: {
-  updateMessage (e) {
-    this.$store.commit('updateMessage', e.target.value)
-  }
-}
-```
-
-E aqui está o manipulador de mutação:
-
-``` js
-// ...
-mutations: {
-  updateMessage (state, message) {
-    state.obj.message = message
-  }
-}
-```
-
-### Dados computados bidirecionais (Two-way)
-
-É certo que o acima é um pouco mais detalhado do que o `v-model` + estado local, e também perdemos alguns dos recursos úteis do `v-model`. Uma abordagem alternativa está usando um dado computado bidirecional com um setter:
- ``` html
-<input v-model="message">
-```
-``` js
-// ...
-computed: {
-  message: {
-    get () {
-      return this.$store.state.obj.message
-    },
-    set (value) {
-      this.$store.commit('updateMessage', value)
-    }
-  }
-}
-```

+ 0 - 107
docs-gitbook/pt-br/getters.md

@@ -1,107 +0,0 @@
-# _Getters_
-
-Às vezes, talvez precisemos calcular o estado derivado com base no estado do _store_, por exemplo, filtrar através de uma lista de itens e contá-los:
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.state.todos.filter(todo => todo.done).length
-  }
-}
-```
-
-Se mais do que um componente precisa fazer uso disso, temos que duplicar a função, ou extraí-lo em um auxiliar compartilhado e importá-lo em vários lugares - ambos são menos do que o ideal.
-O Vuex nos permite definir _getters_ no _store_. Você pode pensar neles como dados computados para os _stores_. Como os dados computados, o resultado de um _getter_ é armazenado em cache com base em suas dependências e só irá avaliar novamente quando algumas de suas dependências mudarem.
-
-_Getters_ receberam o estado como seu 1º argumento:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    todos: [
-      { id: 1, text: '...', done: true },
-      { id: 2, text: '...', done: false }
-    ]
-  },
-  getters: {
-    doneTodos: state => {
-      return state.todos.filter(todo => todo.done)
-    }
-  }
-})
-```
-
-Os _getters_ serão descritos no objeto `store.getters`:
-
-``` js
-store.getters.doneTodos // -> [{ id: 1, text: '...', done: true }]
-```
-
-_Getters_ também podem receber outros _getters_ como o 2º argumento:
-
-``` js
-getters: {
-  // ...
-  doneTodosCount: (state, getters) => {
-    return getters.doneTodos.length
-  }
-}
-```
-
-``` js
-store.getters.doneTodosCount // -> 1
-```
-
-Agora podemos usar facilmente isso dentro de qualquer componente:
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.getters.doneTodosCount
-  }
-}
-```
-
-Você também pode passar argumentos para os _getters_ retornando uma função. Isso é particularmente útil quando você deseja consultar um _array_ no _store_ :
-
-```js
-getters: {
-  // ...
-  getTodoById: (state) => (id) => {
-    return state.todos.find(todo => todo.id === id)
-  }
-}
-```
-
-``` js
-store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }
-```
-
-### O auxiliar `mapGetters`
-
-O auxiliar `mapGetters` simplesmente mapeia os _getters_ do _store_ para os dados computados locais:
-
-``` js
-import { mapGetters } from 'vuex'
-
-export default {
-  // ...
-  computed: {
-    // misturar os getters em dados computados com o spread operator
-    ...mapGetters([
-      'doneTodosCount',
-      'anotherGetter',
-      // ...
-    ])
-  }
-}
-```
-
-Se você deseja mapear um _getter_ para um nome diferente, use um objeto:
-
-``` js
-...mapGetters({
-  // mapeia `this.doneCount` para `store.getters.doneTodosCount`
-  doneCount: 'doneTodosCount'
-})
-```

+ 0 - 43
docs-gitbook/pt-br/getting-started.md

@@ -1,43 +0,0 @@
-# Começando
-
-No centro de cada aplicação Vuex existe o **_store_**. Um "_store_" é basicamente um recipiente que contém a sua aplicação **state**. Há duas coisas que tornam um _store_ Vuex diferente de um objeto global simples:
-
-1. Os _stores_ Vuex são reativos. Quando os componentes do Vue obtêm o estado dele, eles atualizarão de forma reativa e eficiente se o estado do _store_ mudar.
-
-2. Você não pode mutar diretamente o estado do _store_. A única maneira de mudar o estado de um _store_ é explicitamente **fazer _commit_ de mutações**. Isso garante que cada mudança de estado deixe um registro rastreável e permite ferramentas que nos ajudem a entender melhor nossas aplicações.
-
-### Armazenamento de Estado Simples
-
-> **NOTA:** Vamos usar a sintaxe ES2015 para exemplos de código para o resto dos documentos. Se você ainda não aprendeu como usá-la, [veja aqui](https://babeljs.io/docs/learn-es2015/)!
-
-Após [instalar](installation.md) Vuex, vamos criar um _store_. É bem simples - apenas forneça um objeto de estado inicial e algumas mutações:
-
-``` js
-// Certifique-se de chamar Vue.use(Vuex) primeiro se estiver usando o sistema de módulos
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  }
-})
-```
-
-Agora, você pode acessar o objeto de estado como `store.state` e acionar uma mudança de estado com o método `store.commit`:
-
-``` js
-store.commit('increment')
-
-console.log(store.state.count) // -> 1
-```
-
-Novamente, a razão pela qual estamos fazendo _commit_ de uma mutação em vez de mudar `store.state.count` diretamente, é porque queremos rastreá-la explicitamente. Esta convenção simples torna sua intenção mais explícita, de modo que você possa ter melhores argumentos sobre as mudanças de estado em seu aplicativo ao ler o código. Além disso, isso nos dá a oportunidade de implementar ferramentas que podem registrar cada mutação, tirar _snapshots_ de estado ou mesmo realizar depuração viajando pelo histórico de estado (_time travel_).
-
-Usar o estado do _store_ em um componente simplesmente envolve o retorno do estado dentro de um dado computado, porque o estado do _store_ é reativo. Fazer alterações simplesmente significa fazer _commit_ de mutações nos métodos dos componentes.
-
-Aqui está um exemplo do [aplicativo de contador do Vuex mais básico](https://jsfiddle.net/n9jmu5v7/1269/).
-
-Em seguida, discutiremos cada conceito chave em mais detalhes, começando com [Estado](state.md).

+ 0 - 44
docs-gitbook/pt-br/hot-reload.md

@@ -1,44 +0,0 @@
-# Hot Reloading (recarregamento rapido)
-
-O Vuex suporta hot reloading de mutações, módulos, ações e _getters_ durante o desenvolvimento, usando o pacote do webpack [Hot Module Replacement API](https://webpack.js.org/guides/hot-module-replacement/). Você também pode usá-lo em Browserify com o plugin [browserify-hmr](https://github.com/AgentME/browserify-hmr/).
-
-Para mutações e módulos, você precisa usar o método da API `store.hotUpdate()`:
-
-``` js
-// store.js
-import Vue from 'vue'
-import Vuex from 'vuex'
-import mutations from './mutations'
-import moduleA from './modules/a'
-
-Vue.use(Vuex)
-
-const state = { ... }
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  modules: {
-    a: moduleA
-  }
-})
-
-if (module.hot) {
-  // Aceita ações e mutações como 'hot modules'
-  module.hot.accept(['./mutations', './modules/a'], () => {
-    // Necessita dos módulos atualizados
-    // Necessário adicionar .default devido ao módulo babel 6
-    const newMutations = require('./mutations').default
-    const newModuleA = require('./modules/a').default
-    // trocar as novas ações e mutações
-     store.hotUpdate({
-      mutations: newMutations,
-      modules: {
-        a: newModuleA
-      }
-    })
-  })
-}
-```
-
-Confira o [counter-hot example](https://github.com/vuejs/vuex/tree/dev/examples/counter-hot) para usar o hot-reload.

binární
docs-gitbook/pt-br/images/flow.png


binární
docs-gitbook/pt-br/images/vuex.png


+ 0 - 76
docs-gitbook/pt-br/installation.md

@@ -1,76 +0,0 @@
-# Instalação
-
-### Download Direto / CDN
-
-[https://unpkg.com/vuex](https://unpkg.com/vuex)
-
-<!--email_off-->
-[Unpkg.com](https://unpkg.com) fornece links CDN baseados em NPM. O link acima sempre apontará para a última versão do NPM. Você também pode usar uma versão / tag específica por meio de URLs como `https://unpkg.com/vuex@2.0.0`.
-<!--/email_off-->
-
-Inclua `vuex` após o Vue e ele se instalará automaticamente:
-
-``` html
-<script src="/path/to/vue.js"></script>
-<script src="/path/to/vuex.js"></script>
-```
-
-### NPM
-
-``` bash
-npm install vuex --save
-```
-
-### Yarn
-
-``` bash
-yarn add vuex
-```
-
-Quando usado com sistema de módulos, você deve instalar explicitamente o Vuex via `Vue.use()`:
-
-``` js
-import Vue from 'vue'
-import Vuex from 'vuex'
-
-Vue.use(Vuex)
-```
-
-Você não precisa fazer isso ao usar tags globais de script.
-
-### Promise
-
-Vuex requer [Promise](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Usando_promises). Se os seus navegadores não implementarem o Promise (e.g. IE), você pode usar uma polyfill library, como a [es6-promise](https://github.com/stefanpenner/es6-promise).
-
-Você pode incluí-la via CDN:
-
-``` html
-<script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js"></script>
-```
-
-Então `window.Promise` estará disponível automaticamente.
-
-Se você preferir usar um gerenciador de pacotes como NPM ou Yarn, instale-o com os seguintes comandos:
-
-``` bash
-npm install es6-promise --save # NPM
-yarn add es6-promise # Yarn
-```
-
-Além disso, adicione a linha abaixo em qualquer lugar no seu código antes de usar o Vuex:
-
-``` js
-import 'es6-promise/auto'
-```
-
-### Dev Build
-
-Você terá que clonar diretamente do GitHub e fazer o build do `vuex` se
-quiser usar a compilação mais recente do dev.
-
-``` bash
-git clone https://github.com/vuejs/vuex.git node_modules/vuex
-cd node_modules/vuex
-npm install
-npm run build
-```

+ 0 - 63
docs-gitbook/pt-br/intro.md

@@ -1,63 +0,0 @@
-# O que é Vuex?
-
-O Vuex é um **padrão de gerenciamento de estado + biblioteca** para aplicativos Vue.js. Ele serve como um _store_ centralizado para todos os componentes em uma aplicação, com regras garantindo que o estado só possa ser mutado de forma previsível. Ele também se integra com a extensão oficial [Vue devtools](https://github.com/vuejs/vue-devtools) para fornecer recursos avançados sem configurações adicionais, como depuração viajando pelo histórico de estado (_time travel_) e exportação/importação de registros de estado em determinado momento.
-
-### O que é um "Padrão de Gerenciamento do Estado"?
-
-Vamos começar com um simples aplicativo de contador Vue:
-
-``` js
-new Vue({
-  // state
-  data () {
-    return {
-      count: 0
-    }
-  },
-  // view
-  template: `
-    <div>{{ count }}</div>
-  `,
-  // actions
-  methods: {
-    increment () {
-      this.count++
-    }
-  }
-})
-```
-
-É um aplicativo autônomo com as seguintes partes:
-
-- O **estado** (_state_), que é a fonte da verdade que impulsiona nosso aplicativo;
-- A **_view_**, que é apenas um mapeamento declarativo do **estado**;
-- As **ações** (_actions_), que são as possíveis maneiras pelas quais o estado pode mudar em reação às entradas de usuários da **_view_**.
-
-Esta é uma representação extremamente simples do conceito de "fluxo de dados unidirecional":
-<p style="text-align: center; margin: 2em">
-  <img style="width:100%;max-width:450px;" src="./images/flow.png">
-</p>
-
-No entanto, a simplicidade rapidamente se quebra quando temos **múltiplos componentes que compartilham o estado comum**:
-
-- Várias visualizações podem depender da mesma parte do estado.
-
-- As ações de diferentes _views_ podem precisar mutar a mesma parte de estado
-Para o problema um, passar propriedades pode ser tediosos para componentes profundamente aninhados e simplesmente não funcionam para componentes irmãos. Para o problema dois, muitas vezes nos encontramos recorrendo a soluções como a busca de referências diretas de instâncias pai / filho ou tentando mutar e sincronizar múltiplas cópias do estado através de eventos. Ambos esses padrões são frágeis e rapidamente levam a um código não sustentável.
-
-Então, por que não extraímos o estado compartilhado dos componentes e gerenciamos isso em um singleton global? Com isso, nossa árvore de componentes se torna uma grande _view_, e qualquer componente pode acessar o estado ou ações de trigger, não importa onde eles estão na árvore!
-
-Além disso, definindo e separando os conceitos envolvidos na gestão do estado e aplicando certas regras, também damos ao nosso código mais estrutura e capacidade de manutenção.
-
-Esta é a idéia básica por trás do Vuex, inspirada por
- [Flux](https://facebook.github.io/flux/docs/overview), [Redux](http://redux.js.org/) e [The Elm Architecture](https://guide.elm-lang.org/architecture/). Ao contrário dos outros padrões, o Vuex também é uma implementação de biblioteca adaptada especificamente para Vue.js para aproveitar seu sistema de reatividade granular para atualizações eficientes.
-
-![vuex](./images/vuex.png)
-
-### Quando devo usá-lo?
-
-Embora o Vuex nos ajude a lidar com gerenciamento de estado compartilhado, ele também vem com o custo de mais conceitos e relatórios. É um trade-off entre produtividade a curto prazo e longo prazo.
-
-Se você nunca construiu um SPA de grande escala e pulando direito para o Vuex, pode parecer detalhista e assustador. Isso é perfeitamente normal - se o seu aplicativo for simples, você provavelmente estará bem sem o Vuex. Um simples [global event bus](https://br.vuejs.org/v2/guide/components.html#Comunicacao-Nao-Pai-Filho) pode ser tudo o que você precisa. Mas se você estiver construindo um SPA de médio a grande escala, é provável que você tenha encontrado situações que o façam pensar sobre como lidar melhor com o estado fora dos componentes do Vue e o Vuex será o próximo passo natural para você. Há uma boa citação de Dan Abramov, o autor do Redux:
-
-> As bibliotecas Flux são como óculos: você saberá quando você precisar deles.

+ 0 - 287
docs-gitbook/pt-br/modules.md

@@ -1,287 +0,0 @@
-# Módulos
-
-Devido ao uso de uma árvore de um único estado, todo o estado do nosso aplicativo está contido dentro de um objeto grande. No entanto, à medida que nossa aplicação cresce em escala, o _store_ pode ficar realmente inchado.
-Para ajudar com isso, o Vuex nos permite dividir nosso _store_ em **módulos**. Cada módulo pode conter seu próprio estado, mutações, ações, _getters_ e até mesmo módulos aninhados – tudo é "quebrado" daqui pra frente:
-
-``` js
-const moduleA = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... },
-  getters: { ... }
-}
-
-const moduleB = {
-  state: { ... },
-  mutations: { ... },
-  actions: { ... }
-}
-
-const store = new Vuex.Store({
-  modules: {
-    a: moduleA,
-    b: moduleB
-  }
-})
-
-store.state.a // -> `moduleA`'s state
-store.state.b // -> `moduleB`'s state
-```
-
-### Estado Local do Módulo
-
-Dentro das mutações e _getters_ de um módulo, o 1º argumento recebido será **o estado local do módulo**.
-
- ``` js
-const moduleA = {
-  state: { count: 0 },
-  mutations: {
-    increment (state) {
-      // `state` é o estado local do modulo
-      state.count++
-    }
-  },
-
-  getters: {
-    doubleCount (state) {
-      return state.count * 2
-    }
-  }
-}
-```
-
-Da mesma forma, dentro das ações do módulo ( _actions_ ), `context.state` irá expor o estado local e o estado raiz será exposto como `context.rootState`:
-
-``` js
-const moduleA = {
-  // ...
-  actions: {
-    incrementIfOddOnRootSum ({ state, commit, rootState }) {
-      if ((state.count + rootState.count) % 2 === 1) {
-        commit('increment')
-      }
-    }
-  }
-}
-```
-
-Além disso, dentro do módulo _getters_, o estado raiz será exibido como seu 3º argumento:
-
-``` js
-const moduleA = {
-  // ...
-  getters: {
-    sumWithRootCount (state, getters, rootState) {
-      return state.count + rootState.count
-    }
-  }
-}
-```
-
-### Namespacing
-
-Por padrão, ações, mutações e _getters_ dentro de módulos ainda estão registradas no **namespace global** - isso permite que vários módulos reajam com o mesmo tipo de mutação / ação.
-Se você deseja que seus módulos sejam mais autônomos ou reutilizáveis, você pode marcá-lo como namespaced com `namespaced: true`. Quando o módulo é registrado, todos os seus _getters_, ações e mutações serão automaticamente escritos com nomes com base no caminho no qual o módulo está registrado. Por exemplo:
-
-``` js
-const store = new Vuex.Store({
-  modules: {
-    account: {
-      namespaced: true,
-
-      // module assets
-      state: { ... }, // O estado do módulo já está aninhado e não é afetado pela opção de namespaced
-       getters: {
-        isAdmin () { ... } // -> getters['account/isAdmin']
-      },
-      actions: {
-        login () { ... } // -> dispatch('account/login')
-      },
-      mutations: {
-        login () { ... } // -> commit('account/login')
-      },
-
-      // módulos aninhados
-      modules: {
-        // herda o namespace do modulo pai
-        myPage: {
-          state: { ... },
-          getters: {
-            profile () { ... } // -> getters['account/profile']
-          }
-        },
-
-        // aninhar ainda mais o namespace
-        posts: {
-          namespaced: true,
-
-          state: { ... },
-          getters: {
-            popular () { ... } // -> getters['account/posts/popular']
-          }
-        }
-      }
-    }
-  }
-})
-```
-
-Os _getters_ e as ações _Namespaced_ receberão _getters_, _dispatch_ e _commit_ localizados. Em outras palavras, você pode usar os recursos do módulo sem prefixo de escrita no mesmo módulo. Alternar entre _namespaced_ ou não, não afeta o código dentro do módulo.
-
-#### Acessando Assets Globais em Módulos Namespaced
-
-Se você quiser usar estado global e _getters_, _rootState_ e _rootGetters_ são passados como o 3º e 4º argumentos para funções _getter_, e também expostos como propriedades no objeto _context_ passado para funções de ação.
-
-Para enviar ações ou fazer um _commit_ de mutações no _namespace_ global, passe `{root: true}` como o 3º argumento para _dispatch_ e _commit_.
-
- ``` js
-modules: {
-  foo: {
-    namespaced: true,
-
-    getters: {
-      // `getters` está localizado nos getters deste módulo
-      // você pode usar rootGetters como 4º argumento de getters
-      someGetter (state, getters, rootState, rootGetters) {
-        getters.someOtherGetter // -> 'foo/someOtherGetter'
-        rootGetters.someOtherGetter // -> 'someOtherGetter'
-      },
-      someOtherGetter: state => { ... }
-    },
-
-    actions: {
-      // despachar e confirmar também estão localizados para este módulo
-      // eles aceitarão a opção `root` para o envio / commit da raiz
-
-      someAction ({ dispatch, commit, getters, rootGetters }) {
-        getters.someGetter // -> 'foo/someGetter'
-        rootGetters.someGetter // -> 'someGetter'
-
-        dispatch('someOtherAction') // -> 'foo/someOtherAction'
-        dispatch('someOtherAction', null, { root: true }) // -> 'someOtherAction'
-
-        commit('someMutation') // -> 'foo/someMutation'
-        commit('someMutation', null, { root: true }) // -> 'someMutation'
-      },
-      someOtherAction (ctx, payload) { ... }
-    }
-  }
-}
-```
-
-#### Usando Métodos Auxiliares com Namespace
-
-Ao vincular um módulo com namespace aos componentes com os auxiliares `mapState`, `mapGetters`, `mapActions` e `mapMutations`, ele pode ficar um pouco verboso:
-``` js
-computed: {
-  ...mapState({
-    a: state => state.some.nested.module.a,
-    b: state => state.some.nested.module.b
-  })
-},
-methods: {
-  ...mapActions([
-    'some/nested/module/foo',
-    'some/nested/module/bar'
-  ])
-}
-```
-
-Nesses casos, você pode passar a String de _namespace_ do módulo como o 1º argumento para os auxiliares para que todas as ligações sejam feitas usando esse módulo como contexto. O anterior pode ser simplificado para:
-
-
-``` js
-computed: {
-  ...mapState('some/nested/module', {
-    a: state => state.a,
-    b: state => state.b
-  })
-},
-methods: {
-  ...mapActions('some/nested/module', [
-    'foo',
-    'bar'
-  ])
-}
-```
-
-Além disso, você pode criar _helpers_ com nomes usando o `createNamespacedHelpers`. Ele retorna um objeto com novos auxiliares de ligação de componentes que estão vinculados com o valor de namespace fornecido:
-
-``` js
-import { createNamespacedHelpers } from 'vuex'
-
-const { mapState, mapActions } = createNamespacedHelpers('some/nested/module')
-
-export default {
-  computed: {
-    // look up in `some/nested/module`
-    ...mapState({
-      a: state => state.a,
-      b: state => state.b
-    })
-  },
-  methods: {
-    // look up in `some/nested/module`
-    ...mapActions([
-      'foo',
-      'bar'
-    ])
-  }
-}
-```
-
-#### Advertência para desenvolvedores de plugin
-Você pode se preocupar com o namespacing imprevisível para seus módulos quando você cria um [plugin](plugins.md) que fornece os módulos e permite que os usuários os adicionem a um _store_ Vuex. Seus módulos serão também escritos por namespacing se os usuários do plugin adicionarem seus módulos em um módulo namespace. Para adaptar esta situação, talvez seja necessário receber um valor de namespace através da opção do plugin:
-
-``` js
-// pega o valor do namespace via opção de plugin
-// e retorna a função de plugin Vuex
-export function createPlugin (options = {}) {
-  return function (store) {
-    // add namespace to plugin module's types
-    const namespace = options.namespace || ''
-    store.dispatch(namespace + 'pluginAction')
-  }
-}
-```
-
-### Registro de Módulo Dinâmico
-Você pode registrar um módulo **após** o _store_ ser criado com o método `store.registerModule`:
-
-``` js
-// registrando um módulo `myModule`
-store.registerModule('myModule', {
-  // ...
-})
-
-// registrando um módulo aninhado `nested/myModule`
-store.registerModule(['nested', 'myModule'], {
-  // ...
-})
-```
-
-O estado do módulo será exposto como `store.state.myModule` e `store.state.nested.myModule`.
-O registro de módulo dinâmico torna possível que outros plugins do Vue também usem o Vuex para gerenciamento de estado anexando um módulo ao _store_ do aplicativo. Por exemplo, a biblioteca [`vuex-router-sync`](https://github.com/vuejs/vuex-router-sync) integra vue-router com vuex, gerenciando o estado da rota do aplicativo em um módulo anexado dinamicamente.
-
-Você também pode remover um módulo registrado dinamicamente com `store.unregisterModule(moduleName)`. Observe que você não pode remover módulos estáticos (declarados na criação da _store_ ) com este método.
-Pode ser provável que você queira preservar o estado anterior ao registrar um novo módulo, como preservar o estado de um aplicativo _Server Side Rendered_. Você pode conseguir isso com a opção `preserveState`: `store.registerModule ('a', module, {preserveState: true}) `
-
-### Reutilização do Módulo
-Às vezes, talvez precisemos criar várias instâncias de um módulo, por exemplo:
-
-- Criando várias _stores_ que usam o mesmo módulo (por exemplo, para [evitar Singletons com informações de estado no SSR](https://ssr.vuejs.org/en/structure.html#avoid-statelet-singletons) quando a opção `runInNewContext` é `false` ou `'once'`);
-- Registre o mesmo módulo várias vezes na mesma _store_.
-
-Se usarmos um objeto simples para declarar o estado do módulo, esse objeto de estado será compartilhado por referência e causará poluição do estado do armazenamento / módulo quando estiver mutado.
-Este é exatamente o mesmo problema com `data` dentro dos componentes do Vue. Portanto, a solução também é a mesma - use uma função para declarar o estado do módulo (suportado em 2.3.0+):
-
-``` js
-const MyReusableModule = {
-  state () {
-    return {
-      foo: 'bar'
-    }
-  },
-  // mutações, ações, getters...
-}
-```

+ 0 - 171
docs-gitbook/pt-br/mutations.md

@@ -1,171 +0,0 @@
-# Mutações
-
-A única maneira de mudar o estado em um _store_ Vuex é fazendo _commit_ de uma mutação. As mutações Vuex são muito semelhantes aos eventos: cada mutação possui uma String **tipo** e um **manipulador**. A função do manipulador é onde nós executamos modificações de estado reais e receberá o estado como o 1º argumento:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 1
-  },
-  mutations: {
-    increment (state) {
-      // muda o estado
-      state.count++
-    }
-  }
-})
-```
-
-Você não pode chamar diretamente um manipulador de mutação. Pense nisso mais como registro de eventos: "Quando uma mutação com tipo `incremento` é ativada, chame esse manipulador." Para invocar um manipulador de mutação, você precisa chamar `store.commit` com seu tipo:
-
-``` js
-store.commit('increment')
-```
-
-### _Commit_ com payload
-
-Você pode passar um argumento adicional para `store.commit`, que é chamado de **payload** para a mutação:
-
-``` js
-// ...
-mutations: {
-  increment (state, n) {
-    state.count += n
-  }
-}
-```
-``` js
-store.commit('increment', 10)
-```
-
-Na maioria dos casos, o payload deve ser um objeto para que ele possa conter vários campos e a mutação gravada também será mais descritiva:
-
-``` js
-// ...
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-``` js
-store.commit('increment', {
-  amount: 10
-})
-```
-
-### _Commit_ com _Object-Style_
-
-Uma maneira alternativa de confirmar uma mutação é usando diretamente um objeto que possui uma propriedade `type`:
-``` js
-store.commit({
-  type: 'increment',
-  amount: 10
-})
-```
-
-Ao fazer um _commit_ com object-style, todo o objeto será passado como payload para os manipuladores de mutação, de modo que o manipulador permaneça o mesmo:
-
-``` js
-mutations: {
-  increment (state, payload) {
-    state.count += payload.amount
-  }
-}
-```
-
-### Mutações seguem as regras de reatividade do Vue
-
-Uma vez que o estado de um _store_ Vuex é reativo para o Vue, quando mutar o estado, os componentes Vue que observam o estado serão atualizados automaticamente. Isso também significa que as mutações Vuex estão sujeitas às mesmas ressalvas de reatividade quando se trabalha com apenas Vue:
-
-1. Prefira inicializar o estado inicial do seu _store_ com todos os campos desejados antecipadamente.
-
-2. Ao adicionar novas propriedades a um objeto, você deve:
-
-  - Use `Vue.set(obj, 'newProp', 123)`, ou
-
-
-  - Substitua esse Objeto por um novo. Por exemplo, usando o estágio 3 [object spread syntax](https://github.com/sebmarkbage/ecmascript-rest-restpread), podemos gravá-lo assim:
-
-
-    ``` js
-    state.obj = { ...state.obj, newProp: 123 }
-    ```
-
-### Usando Constantes para Tipos de Mutação
-
-É um padrão normalmente visto para usar constantes para tipos de mutação em várias implementações de Flux. Isso permite que o código aproveite ferramentas como linters e colocar todas as constantes em um único arquivo permite que seus colaboradores tenham uma visão rápida de quais mutações são possíveis em todo o aplicativo:
-
-``` js
-// mutation-types.js
-export const SOME_MUTATION = 'SOME_MUTATION'
-```
-
-``` js
-// store.js
-import Vuex from 'vuex'
-import { SOME_MUTATION } from './mutation-types'
-
-const store = new Vuex.Store({
-  state: { ... },
-  mutations: {
-    // podemos usar o recurso de dado computado do ES2015
-    // usar uma constante como o nome da função
-    [SOME_MUTATION] (state) {
-      // mutate state
-    }
-  }
-})
-```
-
-Querer usar constantes é ,em grande parte, uma preferência - pode ser útil em grandes projetos com muitos desenvolvedores, mas é totalmente opcional se você não gosta deles.
-
-### Mutações devem ser síncronas
-
-Uma regra importante a lembrar é que **as funções do manipulador de mutação devem ser síncronas**. Por quê? Considere o seguinte exemplo:
-
-``` js
-mutations: {
-  someMutation (state) {
-    api.callAsyncMethod(() => {
-      state.count++
-    })
-  }
-}
-```
-
-Agora imagine que estamos depurando o aplicativo e observamos os registros de mutação do devtool. Para cada mutação registrada, o devtool precisará capturar "antes" e "depois" _snapshots_ do estado. No entanto, o retorno de chamada assíncrono dentro da mutação de exemplo acima torna isso impossível: o _callback_ ainda não foi chamado quando a mutação foi comitada, e não existe nenhuma maneira para o devtool saber quando o _callback_ será chamado - qualquer mutação de estado realizada no retorno desse _callback_ é essencialmente não rastreável!
-
-### Fazendo _commit_ de Mutações em Componente
-Você pode fazer um _commit_ de mutações em componentes com `this.$store.commit('xxx')`, ou use o auxiliar `mapMutations` que mapeia métodos de componente para chamadas `store.commit` (requer injeção do _store_ na instância raiz):
-``` js
-import { mapMutations } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapMutations([
-      'increment', // mapeia `this.increment()` para `this.$store.commit('increment')`
-
-      // `mapMutations` também suporta payloads:
-      'incrementBy' // mapeia `this.incrementBy(amount)` para `this.$store.commit('incrementBy', amount)`
-    ]),
-    ...mapMutations({
-      add: 'increment' // mapeia `this.add()` para `this.$store.commit('increment')`
-    })
-  }
-}
-```
-
-### Ações
-
-Assincronicidade combinada com a mutação do estado pode tornar o seu programa muito difícil de acontecer. Por exemplo, quando você chama dois métodos com retrocessos assíncronos que mutam o estado, como você sabe quando eles são chamados e qual callback foi chamado primeiro? É exatamente por isso que queremos separar os dois conceitos. No Vuex, as mutações **são transações síncronas**:
-
-``` js
-store.commit('increment')
-// qualquer alteração de estado que a mutação "increment" possa causar
-// deve ser feita neste momento
-```
-
-Para lidar com operações assíncronas, vamos apresentar as [Ações](actions.md).

+ 0 - 130
docs-gitbook/pt-br/plugins.md

@@ -1,130 +0,0 @@
-# _Plugins_
-
-Os _stores_ do Vuex aceitam a opção _plugins_ que expõe _hooks_ para cada mutação. Um _plugin_ Vuex é simplesmente uma função que recebe um _store_ como seu único argumento:
-
-
-``` js
-const myPlugin = store => {
-  // chamado quando o store é inicializado
-  store.subscribe((mutation, state) => {
-    // chamada após cada mutação
-    // a mutação vem no formato `{ type, payload }`.
-  })
-}
-```
-
-E pode ser usada assim:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: [myPlugin]
-})
-```
-
-### Fazendo _Commit_ de Mutações dentro de _Plugins_
-
-_Plugins_ não tem permissão para mudar diretamente o estado - similar aos componentes, eles podem apenas disparar mudanças fazendo _commit_ de mutações.
-
-Ao fazer um _commit_ de uma mutação, um _plugin_ pode ser usado para sincronizar uma fonte de dados ao _store_. Por exemplo, para sincronizar uma fonte de dados _websocket_ ao _store_ (isso é só um exemplo inventado, na realidade a função _createPlugin_ pode receber parâmetros adicionais para tarefas mais complexas):
-
-
-``` js
-export default function createWebSocketPlugin (socket) {
-  return store => {
-    socket.on('data', data => {
-      store.commit('receiveData', data)
-    })
-    store.subscribe(mutation => {
-      if (mutation.type === 'UPDATE_DATA') {
-        socket.emit('update', mutation.payload)
-      }
-    })
-  }
-}
-```
-
-``` js
-const plugin = createWebSocketPlugin(socket)
-
-const store = new Vuex.Store({
-  state,
-  mutations,
-  plugins: [plugin]
-})
-```
-
-### Gravando _Snapshots_ do Estado
-
-Às vezes, um _plugin_ pode querer receber _snapshots_ do estado, e comparar o estado pós-mutação com o pré-mutação. Para conseguir isso, você precisa fzer uma cópia profunda do objeto de estado:
-
-
-``` js
-const myPluginWithSnapshot = store => {
-  let prevState = _.cloneDeep(store.state)
-  store.subscribe((mutation, state) => {
-    let nextState = _.cloneDeep(state)
-
-    // compara `prevState` e `nextState`...
-
-    // salva o estado para a próxima mutação
-    prevState = nextState
-  })
-}
-```
-
-**_Plugins_ que tiram _snapshots_ do estado devem ser usados apenas durante o desenvolvimento.** Quando usamos _webpack_ ou _Browserify_, podemos construir nossas próprias ferramentas que lidam com isso para nós:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  plugins: process.env.NODE_ENV !== 'production'
-    ? [myPluginWithSnapshot]
-    : []
-})
-```
-
-O _plugin_ vai ser usado por padrão. Para produção, você vai precisar do [DefinePlugin](https://webpack.js.org/plugins/define-plugin/) para webpack ou [envify](https://github.com/hughsk/envify) para Browserify para converter o valor de  `process.env.NODE_ENV !== 'production'` para `false` na build final.
-
-### _Plugin_ de _Log_ Embutido
-
-> Se você está usando [vue-devtools](https://github.com/vuejs/vue-devtools) provavelmente não precisará disso.
-
-Vuex vem com um _plugin_ de _log_ para casos comuns de depuração:
-
-
-``` js
-import createLogger from 'vuex/dist/logger'
-
-const store = new Vuex.Store({
-  plugins: [createLogger()]
-})
-```
-
-A função _createLogger_ recebe alguns argumentos:
-
-``` js
-const logger = createLogger({
-  collapsed: false, // expande automaticamente funções logadas
-  filter (mutation, stateBefore, stateAfter) {
-    // retorna `true` se a mutação deve ser logada
-    // `mutation` é uma `{ type, payload }`
-    return mutation.type !== "aBlacklistedMutation"
-  },
-  transformer (state) {
-    // transforma o estado antes de logá-lo
-    // por exemplo, retorna apenas uma sub-árvore específica
-    return state.subTree
-  },
-  mutationTransformer (mutation) {
-    // mutações são logadas no formato `{ type, payload }`
-    // mas podemos formatá-las como quiser.
-    return mutation.type
-  },
-  logger: console, // implementação da API `console`, default `console`
-})
-```
-
-O arquivo de _log_ também pode ser incluído diretamente via _tag_ `<script>` e vai expor a função `createVuexLogger` globalmente.
-
-Perceba que esses _plugins_ tiram _snapshots_ do estado, então use-os apenas durante o desenvolvimento.

+ 0 - 106
docs-gitbook/pt-br/state.md

@@ -1,106 +0,0 @@
-# Estado
-
-### Árvore simples de estado
-
-O Vuex usa uma **árvore de estado único** - isto é, este único objeto contém todo o seu nível de aplicativo e serve como _single source of truth_ (fonte única da verdade). Isso também significa que você terá apenas um _store_ para cada aplicativo. Uma única árvore de estado torna simples localizar um pedaço específico do estado, e nos permite facilmente tirar _snapshots_ do estado do aplicativo atual para fins de depuração.
-
-A árvore de um único estado não entra em conflito com a modularidade - em capítulos posteriores, discutiremos como dividir seu estado e mutações em sub-módulos.
-### Obtendo o Vuex State em Vue Components
-
-Então, como exibimos o estado dentro do _store_ em nossos componentes do Vue? Uma vez que os _stores_ Vuex são reativos, a maneira mais simples de "recuperar" o estado é simplesmente retornar algum estado do _store_ dentro de um [dado computado](https://br.vuejs.org/v2/guide/computed.html):
-
-``` js
-// vamos criar um componente de contador
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return store.state.count
-    }
-  }
-}
-```
-
-Sempre que o `store.state.count` muda, fará com que o dado computado seja reavaliado e ative as atualizações de DOM associadas.
-No entanto, esse padrão faz com que o componente dependa no singleton do _store_ global. Ao usar um sistema de módulo, ele precisa importar o _store_ em todos os componentes que usam o estado do _store_ e também requer _mocking_ ao testar o componente.
-
-O Vuex fornece um mecanismo para "injetar" o _store_ em todos os componentes filho do componente raiz com a opção `store` (habilitada por `Vue.use(Vuex)`):
-``` js
-const app = new Vue({
-  el: '#app',
-  // forneça o store usando a opção "store".
-  // isso irá injetar a instância do _store_ em todos os componentes filho.
-  store,
-  components: { Counter },
-  template: `
-    <div class="app">
-      <counter></counter>
-    </div>
-  `
-})
-```
-
-Ao fornecer a opção _store_ para a instância raiz, o _store_ será injetado em todos os componentes filho da raiz e estará disponível neles como `this.$store`. Vamos atualizar a nossa implementação _Counter_ :
-
-``` js
-const Counter = {
-  template: `<div>{{ count }}</div>`,
-  computed: {
-    count () {
-      return this.$store.state.count
-    }
-  }
-}
-```
-
-### O auxiliar `mapState`
-
-Quando um componente precisa fazer uso de várias propriedades do estado do _store_ ou _getters_, declarar todos esses dados computados pode ser repetitivo e verboso. Para lidar com isso, podemos usar o auxiliar `mapState` que gera funções _getter_ computadas para nós, economizando algumas linhas de código:
-
-``` js
-// em pleno desenvolvimento, os auxiliares são expostos como Vuex.mapState
- import { mapState } from 'vuex'
-
-export default {
-  // ...
-  computed: mapState({
-    // As arrow functions (ou funções de seta) podem tornar o código muito sucinto!
-    count: state => state.count,
-
-    // passar o valor da String 'count' é o mesmo que `state => state.count`
-    countAlias: 'count',
-
-    // para acessar o estado local com `this`, uma função normal deve ser usada
-     countPlusLocalState (state) {
-      return state.count + this.localCount
-    }
-  })
-}
-```
-
-Também podemos passar um _Array_ de _Strings_ para `mapState` quando o nome de um dado computado mapeado é o mesmo que um nome de árvore secundária do estado.
-
-``` js
-computed: mapState([
-  // map this.count to store.state.count
-  'count'
-])
-```
-
-### Operador de propagação de objetos (_ES2015_ _Spread_ _Operator_ )
-
-Observe que `mapState` retorna um objeto. Como usá-lo em combinação com outras propriedades locais computadas? Normalmente, teríamos que usar um utilitário para fundir vários objetos em um para que possamos passar o objeto final para `computado`. No entanto, com o [Spread Operator](https://github.com/sebmarkbage/ecmascript-rest-spread) (que é uma proposta de ECMAScript em estágio 3), podemos simplificar muito a sintaxe:
-
-``` js
-computed: {
-  localComputed () { /* ... */ },
-  // Misture isso no objeto externo com o Spread Operator
-  ...mapState({
-    // ...
-  })
-}
-```
-
-### Componentes ainda podem ter um estado local
-
-O uso do Vuex não significa que você deve colocar **tudo** no estado do Vuex. Embora colocar mais estado no Vuex torna suas mutações estatais mais explícitas e depuráveis, às vezes também pode tornar o código mais verboso e indireto. Se um pedaço de estado pertence estritamente a um único componente, pode ser bom deixá-lo apenas como um estado local. Você deve pesar os trade-offs e tomar decisões que atendam às necessidades de desenvolvimento da sua aplicação.

+ 0 - 25
docs-gitbook/pt-br/strict.md

@@ -1,25 +0,0 @@
-# Modo estrito
-
-Para habilitar o modo estrito, simplesmente passe `strict: true` ao criar um _store_ Vuex:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: true
-})
-```
-
-Em modo estrito, sempre que o estado do Vuex é mutado fora dos manipuladores de mutação, um erro será lançado. Isso garante que todas as mutações do estado possam ser explicitamente rastreadas por ferramentas de depuração.
-
-### Desenvolvimento vs. Produção
-
-**Não habilite o modo estrito ao implantar para a produção!** O modo estrito executa um observador profundo síncrono na árvore de estados para detectar mutações inapropriadas e pode ser bastante caro quando você faz grande quantidade de mutações no estado. Certifique-se de desligá-lo na produção para evitar o custo de desempenho.
-
-Semelhante aos plugins, podemos deixar as ferramentas de compilação lidar com isso:
-
-``` js
-const store = new Vuex.Store({
-  // ...
-  strict: process.env.NODE_ENV !== 'production'
-})
-```

+ 0 - 30
docs-gitbook/pt-br/structure.md

@@ -1,30 +0,0 @@
-# Estrutura da aplicação
-
-O Vuex não restringe realmente como você estrutura seu código. Em vez disso, ele impõe um conjunto de princípios de alto nível:
-
-1. O estado do nível de aplicativo é centralizado no _store_.
-
-2. A única maneira de mudar o estado é fazendo commit das **mutações**, que são transações síncronas.
-
-3. A lógica assíncrona deve ser encapsulada e pode ser composta com **ações**.
-Enquanto você seguir estas regras, depende de você como estruturar seu projeto. Se o arquivo do seu _store_ for muito grande, basta começar a dividir as ações, mutações e _getters_ em arquivos separados.
-
-Para qualquer aplicativo não trivial, provavelmente precisaremos alavancar módulos. Aqui está uma estrutura de projeto de exemplo:
-
-``` bash
-├── index.html
-├── main.js
-├── api
-│   └── ... # abstrações para fazer pedidos de API
-├── components
-│   ├── App.vue
-│   └── ...
-└── store
-    ├── index.js          # onde montamos módulos e exportamos a store    ├── actions.js            # ações da raiz
-    ├── mutations.js      # mutações da raiz
-    └── modules
-        ├── cart.js       # modulo cart
-        └── products.js   # modulo products
-```
-
-Como referência, confira o [Exemplo do carrinho de compras](https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart).

+ 0 - 220
docs-gitbook/pt-br/testing.md

@@ -1,220 +0,0 @@
-# Testando
-
-As partes principais que queremos testar em Vuex são mutações e ações.
-
-### Testando Mutações
-
-As mutações são muito simples de testar, porque são apenas funções que dependem completamente de seus argumentos. Um truque é que se você estiver usando módulos _ES2015_ e colocar suas mutações dentro do arquivo `store.js`, além da exportação padrão, você também deve exportar as mutações como uma exportação nomeada:
-
-``` js
-const state = { ... }
-
-// exportar `mutações` como uma exportação nomeada
-export const mutations = { ... }
-
-export default new Vuex.Store({
-  state,
-  mutations
-})
-```
-
-Exemplo de teste de uma mutação usando Mocha + Chai (você pode usar qualquer biblioteca de estrutura / asserção que você gosta):
-
-``` js
-// mutations.js
-export const mutations = {
-  increment: state => state.count++
-}
-```
-
-``` js
-// mutations.spec.js
-import { expect } from 'chai'
-import { mutations } from './store'
-
-// destructure assign `mutations`
-const { increment } = mutations
-
-describe('mutations', () => {
-  it('INCREMENT', () => {
-    // mock state
-    const state = { count: 0 }
-    // apply mutation
-    increment(state)
-    // assert result
-    expect(state.count).to.equal(1)
-  })
-})
-```
-
-### Testando ações
-
-As ações podem ser um pouco mais complicadas porque podem chamar as _APIs_ externas. Ao testar ações, geralmente precisamos fazer algum nível de _mocking_ - por exemplo, podemos resumir as chamadas da API em um serviço e simular esse serviço dentro de nossos testes. A fim de simular facilmente as dependências, podemos usar o webpack e [injetor-carregador](https://github.com/plasticine/inject-loader) para agrupar nossos arquivos de teste.
-
-Exemplo de teste de uma ação assíncrona:
-
-``` js
-// actions.js
-import shop from '../api/shop'
-
-export const getAllProducts = ({ commit }) => {
-  commit('REQUEST_PRODUCTS')
-  shop.getProducts(products => {
-    commit('RECEIVE_PRODUCTS', products)
-  })
-}
-```
-
-``` js
-// actions.spec.js
-
-// uso a sintaxe 'require' para inline loaders.
-// com inject-loader, isso retorna uma factory de módulos
-// que nos permite injetar dependências simuladas. import { expect } from 'chai'
-const actionsInjector = require('inject-loader!./actions')
-
-// crie o módulo com nossos mocks
-const actions = actionsInjector({
-  '../api/shop': {
-    getProducts (cb) {
-      setTimeout(() => {
-        cb([ /* mocked response */ ])
-      }, 100)
-    }
-  }
-})
-
-// auxiliar para teste de ação com mutações esperadas
-const testAction = (action, payload, state, expectedMutations, done) => {
-  let count = 0
-
-  // mock commit
-  const commit = (type, payload) => {
-    const mutation = expectedMutations[count]
-
-    try {
-      expect(mutation.type).to.equal(type)
-      if (payload) {
-        expect(mutation.payload).to.deep.equal(payload)
-      }
-    } catch (error) {
-      done(error)
-    }
-
-    count++
-    if (count >= expectedMutations.length) {
-      done()
-    }
-  }
-
-  // chame a ação com store mockada e argumentos
-   action({ commit, state }, payload)
-
-  // verificar se nenhuma mutação deveria ter sido enviada
-  if (expectedMutations.length === 0) {
-    expect(count).to.equal(0)
-    done()
-  }
-}
-
-describe('actions', () => {
-  it('getAllProducts', done => {
-    testAction(actions.getAllProducts, null, {}, [
-      { type: 'REQUEST_PRODUCTS' },
-      { type: 'RECEIVE_PRODUCTS', payload: { /* retorno mockado */ } }
-    ], done)
-  })
-})
-```
-
-### Testando _Getters_
-
-Se seus _getters_ tiverem uma computação complicada, vale a pena testá-los. Os _Getters_ também são muito simples de testar pelo mesmo motivo que as mutações.
-
-Exemplo testando um _getter_ :
-``` js
-// getters.js
-export const getters = {
-  filteredProducts (state, { filterCategory }) {
-    return state.products.filter(product => {
-      return product.category === filterCategory
-    })
-  }
-}
-```
-
-``` js
-// getters.spec.js
-import { expect } from 'chai'
-import { getters } from './getters'
-
-describe('getters', () => {
-  it('filteredProducts', () => {
-    // mock state
-    const state = {
-      products: [
-        { id: 1, title: 'Apple', category: 'fruit' },
-        { id: 2, title: 'Orange', category: 'fruit' },
-        { id: 3, title: 'Carrot', category: 'vegetable' }
-      ]
-    }
-    // mock getter
-    const filterCategory = 'fruit'
-
-    // obter o resultado do getter
-    const result = getters.filteredProducts(state, { filterCategory })
-
-    // afirma o resultado
-    expect(result).to.deep.equal([
-      { id: 1, title: 'Apple', category: 'fruit' },
-      { id: 2, title: 'Orange', category: 'fruit' }
-    ])
-  })
-})
-```
-
-### Execução de testes
-
-Se suas mutações e ações estiverem escritas corretamente, os testes não devem ter dependência direta das APIs do navegador após uma mudança apropriada. Assim, você pode simplesmente agrupar os testes com o webpack e executá-lo diretamente no Node. Alternativamente, você pode usar _mocha-loader_ ou _Karma_ + _karma-webpack_ para executar os testes em navegadores reais.
-
-#### Rodando no _Node_
-
-Crie a seguinte configuração de _webpack_ (juntamente com [`.babelrc`](https://babeljs.io/docs/usage/babelrc/)):
-
-``` js
-// webpack.config.js
-module.exports = {
-  entry: './test.js',
-  output: {
-    path: __dirname,
-    filename: 'test-bundle.js'
-  },
-  module: {
-    loaders: [
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/
-      }
-    ]
-  }
-}
-```
-
-Então:
-
-``` bash
-webpack
-mocha test-bundle.js
-```
-
-#### Rodando no Browser
-
-1. Instale _mocha-loader_.
-2. Mude a `entrada` da configuração do _webpack_ acima para `'mocha-loader! Babel-loader! ./ test.js'`.
-3. Inicie _webpack-dev-server_ usando a configuração.
-4. Vá para _localhost: 8080 / webpack-dev-server / test-bundle_.
-
-#### Rodando no Browser com _Karma_ + _karma-webpack_
-
-Consulte a instalação na [documentação do vue-loader](https://vue-loader.vuejs.org/pt_BR/workflow/testing.html).

+ 0 - 1
docs-gitbook/ru/README.md

@@ -1 +0,0 @@
-{% include "./SUMMARY.md" %}

+ 0 - 21
docs-gitbook/ru/SUMMARY.md

@@ -1,21 +0,0 @@
-# Vuex
-
-> Примечание: для пользователей TypeScript, vuex@>= 3.0 требует версии vue@>=2.5, и наоборот.
-
-- [История изменений](https://github.com/vuejs/vuex/releases)
-- [Установка](installation.md)
-- [Что такое Vuex?](intro.md)
-- [Начало работы](getting-started.md)
-- [Основные понятия](core-concepts.md)
-  - [Состояние](state.md)
-  - [Геттеры](getters.md)
-  - [Мутации](mutations.md)
-  - [Действия](actions.md)
-  - [Модули](modules.md)
-- [Структура приложения](structure.md)
-- [Плагины](plugins.md)
-- [Строгий режим (strict mode)](strict.md)
-- [Обработка форм](forms.md)
-- [Тестирование](testing.md)
-- [Горячая замена](hot-reload.md)
-- [Справочник API](api.md)

+ 0 - 178
docs-gitbook/ru/actions.md

@@ -1,178 +0,0 @@
-# Действия
-
-Действия — похожи на мутации с несколькими отличиями:
-
-- Вместо того, чтобы напрямую менять состояние, действия инициируют мутации;
-- Действия могут использоваться для асинхронных операций.
-
-Зарегистрируем простое действие:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    count: 0
-  },
-  mutations: {
-    increment (state) {
-      state.count++
-    }
-  },
-  actions: {
-    increment (context) {
-      context.commit('increment')
-    }
-  }
-})
-```
-
-Обработчики действий получают объект контекста, содержащий те же методы и свойства, что и сам экземпляр хранилища, так что вы можете вызвать `context.commit` для инициирования мутации или обратиться к состоянию и геттерам через `context.state` и `context.getters`. Позднее при рассмотрении [Модулей](modules.md) мы увидим, однако, что этот контекст — не то же самое, что экземпляр хранилища.
-
-На практике для упрощения кода часто используется [деструктуризация аргументов](https://github.com/lukehoban/es6features#destructuring) из ES2015 (особенно при необходимости многократного вызова `commit`):
-
-``` js
-actions: {
-  increment ({ commit }) {
-    commit('increment')
-  }
-}
-```
-
-### Диспетчеризация действий
-
-Действия запускаются методом `store.dispatch`:
-
-``` js
-store.dispatch('increment')
-```
-
-На первый взгляд может выглядеть глупо: если мы хотим увеличить значение count, почему бы просто не вызвать `store.commit('increment')` напрямую? Помните что **мутации должны быть синхронными**? Для действий такого ограничения нет. Внутри действий можно выполнять **асинхронные** операции:
-
-``` js
-actions: {
-  incrementAsync ({ commit }) {
-    setTimeout(() => {
-      commit('increment')
-    }, 1000)
-  }
-}
-```
-
-Диспетчеризация действий поддерживает тот же объектный синтаксис, что и диспетчеризация мутаций:
-
-``` js
-// параметризированный вызов
-store.dispatch('incrementAsync', {
-  amount: 10
-})
-
-// объектный синтаксис
-store.dispatch({
-  type: 'incrementAsync',
-  amount: 10
-})
-```
-
-Более приближённым к реальности примером действий будет формирование заказа на основе состояния корзины покупок. Логика такого действия включает в себя **вызов асинхронного API** и **инициализацию нескольких мутаций**:
-
-``` js
-actions: {
-  checkout ({ commit, state }, products) {
-    // сохраним находящиеся на данный момент в корзине товары
-    const savedCartItems = [...state.cart.added]
-    // инициируем запрос и "оптимистично" очистим корзину
-    commit(types.CHECKOUT_REQUEST)
-    // предположим, что API магазина позволяет передать коллбэки
-    // для обработки успеха и неудачи при формировании заказа
-    shop.buyProducts(
-      products,
-      // обработка успешного исхода
-      () => commit(types.CHECKOUT_SUCCESS),
-      // обработка неудачного исхода
-      () => commit(types.CHECKOUT_FAILURE, savedCartItems)
-    )
-  }
-}
-```
-
-Таким образом удаётся организовать поток асинхронных операций, записывая побочные эффекты действий в виде мутаций состояния.
-
-### Диспетчеризация действий в компонентах
-
-Диспетчеризировать действия в компонентах можно при помощи `this.$store.dispatch('xxx')` или используя вспомогательную функцию `mapActions`, создающую локальные псевдонимы для действий в виде методов компонента (требуется наличие корневого `$store`):
-
-``` js
-import { mapActions } from 'vuex'
-
-export default {
-  // ...
-  methods: {
-    ...mapActions([
-      'increment' // проксирует `this.increment()` в `this.$store.dispatch('increment')`
-
-      // `mapActions` также поддерживают нагрузку (payloads):
-      'incrementBy' // проксирует `this.incrementBy(amount)` в `this.$store.dispatch('incrementBy', amount)`
-    ]),
-    ...mapActions({
-      add: 'increment' // проксирует `this.add()` в `this.$store.dispatch('increment')`
-    })
-  }
-}
-```
-
-### Композиция действий
-
-Раз действия зачастую асинхронны, то как узнать, что действие уже завершилось? И, что важнее, как быть со связанными между собой действиями при организации более сложных асинхронных потоков?
-
-Первое, что нужно знать — `store.dispatch` может обрабатывать Promise, возвращаемый обработчиком действия, и также возвращает Promise:
-
-``` js
-actions: {
-  actionA ({ commit }) {
-    return new Promise((resolve, reject) => {
-      setTimeout(() => {
-        commit('someMutation')
-        resolve()
-      }, 1000)
-    })
-  }
-}
-```
-
-Теперь можно сделать так:
-
-``` js
-store.dispatch('actionA').then(() => {
-  // ...
-})
-```
-
-А в другом действии — так:
-
-``` js
-actions: {
-  // ...
-  actionB ({ dispatch, commit }) {
-    return dispatch('actionA').then(() => {
-      commit('someOtherMutation')
-    })
-  }
-}
-```
-
-Наконец, если мы используем [async / await](https://tc39.github.io/ecmascript-asyncawait/), то можем компоновать наши действия следующим образом:
-
-``` js
-// предположим, что `getData()` и `getOtherData()` возвращают Promise
-
-actions: {
-  async actionA ({ commit }) {
-    commit('gotData', await getData())
-  },
-  async actionB ({ dispatch, commit }) {
-    await dispatch('actionA') // дожидаемся завершения действия `actionA`
-    commit('gotOtherData', await getOtherData())
-  }
-}
-```
-
-> `store.dispatch` может вызывать несколько обработчиков действий в различных модулях одновременно. В этом случае возвращаемым значением будет Promise, разрешающийся после разрешения всех вызванных обработчиков.

+ 0 - 219
docs-gitbook/ru/api.md

@@ -1,219 +0,0 @@
-# Справочник API
-
-### Vuex.Store
-
-``` js
-import Vuex from 'vuex'
-
-const store = new Vuex.Store({ ...options })
-```
-
-### Опции конструктора Vuex.Store
-
-- **state**
-
-  - тип: `Object | Function`
-
-    Корневой объект состояния хранилища Vuex. [Подробнее](state.md)
-
-    Если вы передаёте функцию, возвращающую объект, то возвращаемый объект будет использован в качестве корневого состояния. Это может быть полезным, если вы хотите повторно использовать объект состояния, особенно при повторном использовании модулей. [Подробнее](modules.md#повторное-использование-модулей)
-
-- **mutations**
-
-  - тип: `{ [type: string]: Function }`
-
-    Регистрирует доступные для хранилища мутации. Обработчики мутаций первым аргументом всегда получают `state` (при использовании модулей это будет локальный state модуля). Вторым аргументом передаётся "нагрузка" (`payload`), если она есть.
-
-    [Подробнее](mutations.md)
-
-- **actions**
-
-  - тип: `{ [type: string]: Function }`
-
-    Регистрирует действия хранилища. В функции-обработчики передаётся объект `context`, со следующими свойствами:
-
-    ``` js
-    {
-      state,      // то же, что и `store.state`, или локальный state при использовании модулей
-      rootState,  // то же, что и `store.state`, только при использовании модулей
-      commit,     // то же, что и `store.commit`
-      dispatch,   // то же, что и `store.dispatch`
-      getters,    // то же, что и `store.getters`
-      rootGetters // то же, что и `store.getters`, только в модулях
-    }
-    ```
-
-    [Подробнее](actions.md)
-
-- **getters**
-
-  - тип: `{ [key: string]: Function }`
-
-    Регистрирует геттеры, используемые в хранилище. Геттер-функции при вызове получают следующие аргументы:
-
-    ```
-    state,     // при использовании модулей — локальный state модуля
-    getters    // то же, что и store.getters
-    ```
-
-    При определении в модуле
-
-    ```
-    state,       // при использовании модулей — локальный state модуля
-    getters,     // локальные геттеры текущего модуля
-    rootState,   // глобальный state
-    rootGetters  // все геттеры
-    ```
-
-    Зарегистрированные геттеры далее доступны в `store.getters`.
-
-    [Подробнее](getters.md)
-
-- **modules**
-
-  - тип: `Object`
-
-    Объект, содержащий подмодули для помещения в хранилище, в формате:
-
-    ``` js
-    {
-      key: {
-        state,
-        namespaced?,
-        mutations?,
-        actions?,
-        getters?,
-        modules?
-      },
-      ...
-    }
-    ```
-
-    Каждый модуль может содержать `state` и `mutations`, как и корневое хранилище. Состояние модуля будет прикреплено к корневому, по указанному ключу. Мутации и геттеры модуля получают при вызове первым аргументом только локальное состояние, а не корневое. При вызове действий `context.state` аналогичным образом указывает на локальное состояние модуля.
-
-    [Подробнее](modules.md)
-
-- **plugins**
-
-  - тип: `Array<Function>`
-
-    Массив функций-плагинов, которые будут применены к хранилищу. Плагины попросту получают хранилище в качестве единственного аргумента, и могут как отслеживать мутации (для сохранения исходящих данных, логирования или отладки) или инициировать их (для обработки входящих данных, например, веб-сокетов или наблюдателей).
-
-    [Подробнее](plugins.md)
-
-- **strict**
-
-  - тип: `Boolean`
-  - default: `false`
-
-    Заставляет хранилище Vuex использовать strict mode. В strict mode любые изменения состояния, происходящие за пределами обработчиков мутаций, будут выбрасывать ошибки.
-
-    [Подробнее](strict.md)
-
-### Свойства экземпляра Vuex.Store
-
-- **state**
-
-  - тип: `Object`
-
-    Корневое состояние. Только для чтения.
-
-- **getters**
-
-  - тип: `Object`
-
-    Зарегистрированные геттеры. Только для чтения.
-
-### Методы экземпляра Vuex.Store
-
-- **`commit(type: string, payload?: any, options?: Object)`**
-- **`commit(mutation: Object, options?: Object)`**
-
-  Запускает мутацию. `options` может содержать опцию `root: true` что разрешает совершать корневые (root) мутации [в модулях со своим пространством имён](modules.md#пространства-имён). [Подробнее](mutations.md)
-
-- **`dispatch(type: string, payload?: any, options?: Object)`**
-- **`dispatch(action: Object, options?: Object)`**
-
-  Инициирует действие. `options` может содержать опцию `root: true` что разрешает совершать корневые (root)  действия [в модулях со своим пространством имён](modules.md#пространства-имён). Возвращает Promise который разрешает все обработчики инициируемых действий. [Подробнее](actions.md)
-
-- **`replaceState(state: Object)`**
-
-  Позволяет заменить корневое состояние хранилища. Используйте только для гидрации состояния / функциональности "машины времени".
-
-- **`watch(getter: Function, cb: Function, options?: Object)`**
-
-  Устанавливает наблюдение за возвращаемым значением геттера, вызывая коллбэк в случае его изменения. Геттер получает состояние хранилища первым аргументом, и геттеры вторым аргументом. Возможно указание дополнительного объекта опций, с такими же параметрами как и у метода `vm.$watch` корневой библиотеки Vue.
-
-  Для прекращения наблюдения, необходимо вызвать возвращаемую функцию обработчик.
-
-- **`subscribe(handler: Function)`**
-
-  Подписывается на мутации хранилища. Обработчик `handler` вызывается после каждой мутации и получает в качестве параметров дескриптор мутации и состояние после мутации:
-
-  ``` js
-  store.subscribe((mutation, state) => {
-    console.log(mutation.type)
-    console.log(mutation.payload)
-  })
-  ```
-
-  Чаще всего используется в плагинах. [Подробнее](plugins.md)
-
-- **`subscribeAction(handler: Function)`**
-
-  > Добавлено в версии 2.5.0
-
-  Подписывается на действие хранилища. Обработчик `handler` вызывается после каждого действия и получает в качестве параметров дескриптов действия и текущее состояние хранилища:
-
-  ``` js
-  store.subscribeAction((action, state) => {
-    console.log(action.type)
-    console.log(action.payload)
-  })
-  ```
-
-  Чаще всего используется в плагинах. [Подробнее](plugins.md)
-
-- **`registerModule(path: string | Array<string>, module: Module, options?: Object)`**
-
-  Регистрирует динамический модуль. [Подробнее](modules.md#динамическая-регистрация-модулей)
-
-  `options` может иметь опцию `preserveState: true`, что позволяет сохранить предыдущее состояние. Полезно с рендерингом на стороне сервера.
-
-- **`unregisterModule(path: string | Array<string>)`**
-
-  Разрегистрирует динамический модуль. [Подробнее](modules.md#динамическая-регистрация-модулей)
-
-- **`hotUpdate(newOptions: Object)`**
-
-  Осуществляет горячую замену действий и мутаций. [Подробнее](hot-reload.md)
-
-### Вспомогательные функции для связывания с компонентами
-
-- **`mapState(namespace?: string, map: Array<string> | Object): Object`**
-
-  Создаёт проксирующие вычисляемые свойства компонента, возвращающие поддерево state'а хранилища Vuex [Подробнее](state.md#вспомогательная-функция-mapstate)
-
-  Первый аргумент опционально может быть строкой с указанным namespace. [Подробнее](modules.md#подключение-с-помощью-вспомогательных-функций-к-пространству-имён)
-
-- **`mapGetters(namespace?: string, map: Array<string> | Object): Object`**
-
-  Создаёт проксирующие вычисляемые свойства компонента, проксирующие доступ к геттерам. [Подробнее](getters.md#вспомогательная-функция-mapgetters)
-
-  Первый аргумент опционально может быть строкой с указанным namespace. [Подробнее](modules.md#подключение-с-помощью-вспомогательных-функций-к-пространству-имён)
-
-- **`mapActions(namespace?: string, map: Array<string> | Object): Object`**
-
-  Создаёт проксирующие методы компонента, позволяющие диспетчеризировать действия. [Подробнее](actions.md#диспетчеризация-действий-в-компонентах)
-
-  Первый аргумент опционально может быть строкой с указанным namespace. [Подробнее](modules.md#подключение-с-помощью-вспомогательных-функций-к-пространству-имён)
-
-- **`mapMutations(namespace?: string, map: Array<string> | Object): Object`**
-
-  Создаёт проксирующие методы компонента, позволяющие инициировать мутации. [Подробнее](mutations.md#вызов-мутаций-в-компонентах)
-
-  Первый аргумент опционально может быть строкой с указанным namespace. [Подробнее](modules.md#подключение-с-помощью-вспомогательных-функций-к-пространству-имён)
-
-- **`createNamespacedHelpers(namespace: string): Object`**
-
-  Создаёт вспомогательные функции для связывания с компонентами для указанного пространства имён. Возвращаемый объект содержит `mapState`, `mapGetters`, `mapActions` и `mapMutations`, которые связаны с указанным пространством имён. [Подробнее](modules.md#подключение-с-помощью-вспомогательных-функций-к-пространству-имён)

+ 0 - 19
docs-gitbook/ru/book.json

@@ -1,19 +0,0 @@
-{
-  "gitbook": ">3.0.0",
-  "plugins": ["edit-link", "prism", "theme-vuejs@git+https://github.com/pearofducks/gitbook-plugin-theme-vuejs.git", "-fontsettings", "-highlight", "github"],
-  "pluginsConfig": {
-    "edit-link": {
-      "base": "https://github.com/vuejs/vuex/tree/dev/docs",
-      "label": "Редактировать эту страницу"
-    },
-    "github": {
-      "url": "https://github.com/vuejs/vuex/"
-    }
-  },
-  "links": {
-    "sharing": {
-      "facebook": false,
-      "twitter": false
-    }
-  }
-}

+ 0 - 12
docs-gitbook/ru/core-concepts.md

@@ -1,12 +0,0 @@
-# Основные понятия
-
-В этих главах мы изучим основные понятия Vuex:
-  - [Состояние](state.md)
-  - [Геттеры](getters.md)
-  - [Мутации](mutations.md)
-  - [Действия](actions.md)
-  - [Модули](modules.md)
-
-Для использования vuex необходимо глубокое понимание всех этих понятий.
-
-Давайте начнём.

+ 0 - 60
docs-gitbook/ru/forms.md

@@ -1,60 +0,0 @@
-# Обработка форм
-
-Если вы используете Vuex в strict mode, привязать `v-model` к состоянию, хранимому во Vue, может быть немного непросто:
-
-``` html
-<input v-model="obj.message">
-```
-
-Предположим, что `obj` — это вычисляемое свойство, возвращающее ссылку на объект из хранилища. В таком случае, `v-model` будет пытаться напрямую изменить значение `obj.message` в ответ на действия пользователя. В strict mode это спровоцирует ошибку, поскольку это изменение происходит вне обработчика мутации Vuex.
-
-Чтобы подружить Vuex с такой ситуацией, следует однонаправленно связать атрибут `value` элемента `<input>` с полем объекта, а для учёта изменений использовать событие `change`:
-
-``` html
-<input :value="message" @input="updateMessage">
-```
-``` js
-// ...
-computed: {
-  ...mapState({
-    message: state => state.obj.message
-  })
-},
-methods: {
-  updateMessage (e) {
-    this.$store.commit('updateMessage', e.target.value)
-  }
-}
-```
-
-А вот и обработчик мутаций:
-
-``` js
-// ...
-mutations: {
-  updateMessage (state, message) {
-    state.obj.message = message
-  }
-}
-```
-
-### Двухсторонние вычисляемые свойства
-
-Заметно, что получившаяся выше запись — куда многословнее, чем используемая в связке `v-model` с локальным состоянием, да и некоторые полезные возможности `v-model` мы таким образом упускаем. В качестве альтернативы можно предложить использование двунаправленного вычисляемого свойства с сеттером:
-
-``` html
-<input v-model="message">
-```
-``` js
-// ...
-computed: {
-  message: {
-    get () {
-      return this.$store.state.obj.message
-    },
-    set (value) {
-      this.$store.commit('updateMessage', value)
-    }
-  }
-}
-```

+ 0 - 108
docs-gitbook/ru/getters.md

@@ -1,108 +0,0 @@
-# Геттеры
-
-Иногда может понадобится доступ к производным данным, основывающимся на состоянии хранилища: например, к отфильтрованной версии списка или количеству элементов в нём:
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.state.todos.filter(todo => todo.done).length
-  }
-}
-```
-
-Если эта функциональность требуется более чем одному компоненту, понадобится либо дублировать функцию, либо выносить её в совместно используемый хелпер и импортировать в нескольких местах. Оба эти подхода далеки от идеала.
-
-Vuex позволяет определять в хранилище «геттеры». Вы можете считать их вычисляемыми свойствами для хранилища. Как и вычисляемые свойства, результаты геттера кэшируются, основываясь на своих зависимостях и будут пересчитаны только тогда, когда изменится одна из его зависимостей.
-
-Геттеры получают первым аргументом ссылку на состояние хранилища:
-
-``` js
-const store = new Vuex.Store({
-  state: {
-    todos: [
-      { id: 1, text: '...', done: true },
-      { id: 2, text: '...', done: false }
-    ]
-  },
-  getters: {
-    doneTodos: state => {
-      return state.todos.filter(todo => todo.done)
-    }
-  }
-})
-```
-
-Геттеры доступны в `store.getters`:
-
-``` js
-store.getters.doneTodos // -> [{ id: 1, text: '...', done: true }]
-```
-
-Вторым аргументом передаётся список всех геттеров:
-
-``` js
-getters: {
-  // ...
-  doneTodosCount: (state, getters) => {
-    return getters.doneTodos.length
-  }
-}
-```
-
-``` js
-store.getters.doneTodosCount // -> 1
-```
-
-В компонентах геттеры можно использовать, например, таким образом:
-
-``` js
-computed: {
-  doneTodosCount () {
-    return this.$store.getters.doneTodosCount
-  }
-}
-```
-
-Вы также можете передавать аргументы геттерам возвращая функцию. Это особенно полезно, если вы хотите вернуть элемент (или часть элементов) массива по переданному критерию:
-
-```js
-getters: {
-  // ...
-  getTodoById: (state) => (id) => {
-    return state.todos.find(todo => todo.id === id)
-  }
-}
-```
-
-``` js
-store.getters.getTodoById(2) // -> { id: 2, text: '...', done: false }
-```
-
-### Вспомогательная функция `mapGetters`
-
-Хелпер `mapGetters` попросту проксирует геттеры хранилища через локальные вычисляемые свойства компонента:
-
-``` js
-import { mapGetters } from 'vuex'
-
-export default {
-  // ...
-  computed: {
-    // примешиваем геттеры в вычисляемые свойства оператором расширения
-    ...mapGetters([
-      'doneTodosCount',
-      'anotherGetter',
-      // ...
-    ])
-  }
-}
-```
-
-Если вы хотите использовать при проксировании другое имя, примените объектный синтаксис:
-
-``` js
-...mapGetters({
-  // проксируем `this.doneCount` в `store.getters.doneTodosCount`
-  doneCount: 'doneTodosCount'
-})
-```

Některé soubory nejsou zobrazeny, neboť je v těchto rozdílových datech změněno mnoho souborů