Vue.js App not compiling after adding Vuex

Question

I have been working on a web app and decided I needed to implement Vuex to help. I tried implementing it and messed up at first, but I don’t know what’s causing it now. I may be overlooking something but I just can’t find it, any help?

Router (index.js)

import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import Products from '../views/Products.vue'
import ProductListView from '../components/ProductListView.vue'
Vue.use(VueRouter)
  const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  },
  {
    path:'/products',
    name: 'Products',
    component: Products,
      children: [
        {
          path: ':ptype',
          name: 'ProductListView',
          component: ProductListView,
          props: true
        }
      ]
  },
  {

    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  }
]
const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

Store (store.js)

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)

const store = new Vuex.Store({
    state: {
        count: 1
    },
    mutations: {
    }
})

export default store

App (main.js)

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from 'store.js'

Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

I'm getting this error when I try running yarn serve in PowerShell

yarn run v1.22.4
$ vue-cli-service serve
'vue-cli-service' is not recognized as an internal or external command,
operable program or batch file.
error Command failed with exit code 1.

run `npm i` again or `npm install -g @vue/cli`. error indicates vue-cli-service isn't installed — user120242, May 30 '20 at 05:50
Your code appears fine and the error should not be related to the addition of vuex. Try starting a fresh project and dropping in your code. — Ronald, May 30 '20 at 07:36
Does this answer your question? [How to solve 'vue-cli-service' is not recognized as an internal or external command?](https://stackoverflow.com/questions/58579843/how-to-solve-vue-cli-service-is-not-recognized-as-an-internal-or-external-comm) — Faraz A., May 30 '20 at 08:22
your code looks fineO_O. you could try export default new Vuex.Store({... or instead import store from 'store.js make sure its the correct path import store from './store.js'' maybe like this?? idk. maybe when you run yarn make sure the path is correct. the problem isnt vuex — Eli Sigal, May 31 '20 at 17:43

Vue.js App not compiling after adding Vuex

0 Answers0