From b1f069a215a5a215e8269b4ca93a6fe0e5cdebf9 Mon Sep 17 00:00:00 2001 From: Andrew Emelianenko Date: Tue, 23 Oct 2018 13:11:38 +0300 Subject: [PATCH] Add optional vuex-electron plugin (#692) * Sync Vuex store between all processes * Add information about `vuex-electron` to docs --- docs/en/vue_accessories.md | 6 ++++++ meta.js | 7 ++++--- template/src/renderer/store/index.js | 10 ++++++++++ 3 files changed, 20 insertions(+), 3 deletions(-) diff --git a/docs/en/vue_accessories.md b/docs/en/vue_accessories.md index 66ab1df0..a209b164 100644 --- a/docs/en/vue_accessories.md +++ b/docs/en/vue_accessories.md @@ -6,6 +6,7 @@ electron-vue comes packed with the following `vue` plugins that can be installed * [vue-electron](https://github.com/SimulatedGREG/vue-electron) \(attach electron APIs to Vue object\) * [vue-router](https://github.com/vuejs/vue-router) \(single page application routes\) * [vuex](https://github.com/vuejs/vuex) \(flux-inspired application architecture\) +* [vuex-electron](https://github.com/vue-electron/vuex-electron) \(sync vuex store between all processes and instances\) --- @@ -33,3 +34,8 @@ The provided project structure should feel familiar to the setup provided in the The provided project structure is rather bare but does encourage the use of `vuex`'s module pattern to help organize your data stores. The extra `@/store/modules/index.js` let's your `vuex` store import all modules in a one-shot manner. +### [`vuex-electron`](https://github.com/vue-electron/vuex-electron) + +> The easiest way to use your Vuex store between all processes (including main) and instances. + +In case if your application has multiple windows, probably you would need to share the state of the application between them. Moreover, probably you would need to share the state of the app between launches or different instances. You could easily solve these two tasks by using `vuex-store`. diff --git a/meta.js b/meta.js index 0ed72f89..79e14573 100644 --- a/meta.js +++ b/meta.js @@ -79,8 +79,8 @@ module.exports = { plugins: { type: 'checkbox', message: 'Select which Vue plugins to install', - choices: ['axios', 'vue-electron', 'vue-router', 'vuex'], - default: ['axios', 'vue-electron', 'vue-router', 'vuex'] + choices: ['axios', 'vue-electron', 'vue-router', 'vuex', 'vuex-electron'], + default: ['axios', 'vue-electron', 'vue-router', 'vuex', 'vuex-electron'] }, eslint: { type: 'confirm', @@ -148,7 +148,8 @@ module.exports = { 'axios': '^0.18.0', 'vue-electron': '^1.0.6', 'vue-router': '^3.0.1', - 'vuex': '^3.0.1' + 'vuex': '^3.0.1', + 'vuex-electron': '^1.0.0' } if (Object.keys(plugins).length > 0) output += ',\n' diff --git a/template/src/renderer/store/index.js b/template/src/renderer/store/index.js index 913f0a2f..e7219b31 100644 --- a/template/src/renderer/store/index.js +++ b/template/src/renderer/store/index.js @@ -1,11 +1,21 @@ import Vue from 'vue' import Vuex from 'vuex' +{{#isEnabled plugins 'vuex-electron'}} +import { createPersistedState, createSharedMutations } from 'vuex-electron' + +{{/isEnabled}} import modules from './modules' Vue.use(Vuex) export default new Vuex.Store({ modules, + {{#isEnabled plugins 'vuex-electron'}} + plugins: [ + createPersistedState(), + createSharedMutations() + ], + {{/isEnabled}} strict: process.env.NODE_ENV !== 'production' })