Adding vuex and vue-router to Spark v2
I have an application using laravel spark v2 and I want to slowly move to Vue2 and out of Laravel Spark altogether little by little as I am a lone person working on my project hence I don't have enough time. I want to move to the prescribed Vue SPA architecture and at this point in time i have a couple of components that I want to create using the Vue SPA philosophy.
In order to do this, I have managed to setup webpack and vue-router and get it working with the current Spark code but I now want to add vuex to the mix and am not sure how to do it.
Right now my main app.js code is fashioned in the manner below.
require('./spark-bootstrap');
require('./components/bootstrap');
Vue.config.debug = true;
window._ = require('lodash');
window.moment = require('moment');
window.lightbox = require('lightbox2');
import introjs from 'intro.js';
import spark from 'spark';
import vueRouter from 'vue-router';
import store from './store';
import routerConfig from './router';
const router = new vueRouter();
class SparkWrapper {
static getVueRouterModule() {
return Object.entries(spark).reduce(
(collection, [key, value]) => {
// explicitly convert 'data' and 'el' attributes to functions
if (['data', 'el'].includes(key)) {
collection[key] = () => value
} else {
// and keep everything else as it is
collection[key] = value
}
return collection
}, {})
}
}
routerConfig(router);
router.start(SparkWrapper.getVueRouterModule(),'body');
I now want to add the store to work with the spark code but am not sure how. Any tips would be appreciated.
Please or to participate in this conversation.