Storybook vue composition api, _router of undefined

I tried to render a component with storybook (vue-cli conf) using the vue-composition-api but I get the following error :

Error: Cannot read property '_router' of undefined

Code of file.stories.ts is given below,

import Vue from 'vue'
import CompositionApi from '@vue/composition-api'
import VueRouter from 'vue-router'

import { storiesOf } from '@storybook/vue'
import Login from '@/ui/views/Login/Login.vue'
import StoryRouter from 'storybook-vue-router'


storiesOf('Components', module)
  .add('Login', () => ({
    components: { Login },
    template: '<Login/>',

and Code of file.vue is given below


export default defineComponent({
  name: 'Login',
  setup(props, { root: { $router } }) {

    function redirectTo() {
       $router.push({ name: 'Home' })

    return {


If I write setup(props, { root }) and then root.$router(...) it works, but I would like to keep destructuring my setup function. Any suggestion how I could do that?

59 thoughts on “Storybook vue composition api, _router of undefined”

Leave a Comment