Static GitHub Issues

[1803] How can I use vuex store in custom Vue object?

prev: Generate only routes provided in generate.routes
next: How to disable plugin vue.fullpage on media query in nuxt.js?

I have to have some component on every pages with different layouts, so I just use entry.js plugin for creating new Vue component and inserting it in document.

entry.js

import someComponent from '@/components/some-component'
import Vue from 'vue'

var someDiv = document.createElement('div');
document.getElementsByTagName('body')[0].appendChild(someDiv);

new Vue(_.extend({}, someComponent, {
  el: someDiv,
}));

And it works fine while I don't use vuex store, but if I would

some-component.vue

<template>
  <div style="position: fixed; background-color: red; height:100px; width:100px;top:0">
      {{text}}
  </div>
</template>
<script>
  import { mapState } from 'vuex'

  export default {

    computed: {
      ...mapState('texts', ['text']),
    },

  };
</script>

It cause errors image

How can I overcome it?

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1620">#c1620</a>)</em></sub></div>