Storybook: [v6.0.0-beta.16] Vue + TypeScript (& NuxtJS) stories not rendering

[HerrBertling]

Describe the bug
I've setup a basic example of a fresh NuxtJS project + TypeScript + vue-property-decorator and can't get the stories to render, even though I'm using the format as described in the docs (=> see here)

To Reproduce
Steps to reproduce the behavior:

1. Clone https://github.com/HerrBertling/sb-ts-nuxt-test
2. Run yarn
3. Run yarn storybook:dev
4. No story content rendered + console error:

You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

Expected behavior
Stories should render.

Code snippets

As an example, here's the BaseButton story:

/* eslint-disable @typescript-eslint/no-unused-vars */
/* eslint-disable no-unused-vars */
import BaseButton from '../index.vue'

export default { title: 'BaseButton' }

export const basic = () => '<base-button>Do not click here!</base-button>'

(Yes, I had to disable eslint to prevent it from shouting at me for importing an unused component…)

System:

System:
    OS: macOS Mojave 10.14.6
    CPU: (4) x64 Intel(R) Core(TM) i7-7660U CPU @ 2.50GHz
  Binaries:
    Node: 12.16.3 - ~/.nvm/versions/node/v12.16.3/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.4 - ~/.nvm/versions/node/v12.16.3/bin/npm
  npmPackages:
    @storybook/vue: ^6.0.0-beta.16 => 6.0.0-beta.16

[shilman]

cc @Aaron-Pool @pksunkara @graup can you guys give a hand?

@HerrBertling I think there is an official nuxtjs storybook preset in the works, but I don't know the current status of that.

[HerrBertling]

Oh, I just found the problem 😆

const path = require('path')

module.exports = {
  stories: ['../**/story/**.js'],
  webpackFinal: async (config) => {
    config.resolve = {
      ...config.resolve,
      alias: {
        '@': path.dirname(path.resolve(__dirname)),
        '~': path.dirname(path.resolve(__dirname))
      }
    }

    return config
  }
}

should spread the existing config.resolve.alias entries as well, so this works:

const path = require('path')

module.exports = {
  stories: ['../**/story/**.js'],
  webpackFinal: async (config) => {
    config.resolve = {
      ...config.resolve,
      alias: {
        ...config.resolve.alias,
        '@': path.dirname(path.resolve(__dirname)),
        '~': path.dirname(path.resolve(__dirname))
      }
    }

    return config
  }
}