.

Author: sacrosanctic

.storybook/main.ts

@@ -1,7 +1,7 @@
 import type { StorybookConfig } from '@nuxtjs/storybook'
 
 const config = {
-  stories: ['../app/**/*.stories.@(js|ts|mdx)'],
+  stories: ['../app/**/*.stories.@(js|ts)'],
   addons: ['@storybook/addon-a11y', '@storybook/addon-docs'],
   framework: '@storybook-vue/nuxt',
   features: {

app/components/Button/Base.stories.ts

@@ -3,17 +3,13 @@ import Component from './Base.vue'
 
 const meta = {
   component: Component,
-  tags: ['autodocs'],
 } satisfies Meta<typeof Component>
 
 export default meta
 type Story = StoryObj<typeof meta>
 
 export const Primary: Story = {
-  args: {
-    variant: 'primary',
-    size: 'medium',
-  },
+  args: {},
   render: args => ({
     components: { Component },
     setup() {
@@ -26,7 +22,6 @@ export const Primary: Story = {
 export const Secondary: Story = {
   args: {
     variant: 'secondary',
-    size: 'medium',
   },
   render: args => ({
     components: { Component },
@@ -53,8 +48,6 @@ export const Small: Story = {
 
 export const Disabled: Story = {
   args: {
-    variant: 'primary',
-    size: 'medium',
     disabled: true,
   },
   render: args => ({
@@ -69,7 +62,6 @@ export const Disabled: Story = {
 export const WithIcon: Story = {
   args: {
     variant: 'secondary',
-    size: 'medium',
     classicon: 'i-carbon:search',
   },
   render: args => ({
@@ -84,7 +76,6 @@ export const WithIcon: Story = {
 export const WithKeyboardShortcut: Story = {
   args: {
     variant: 'secondary',
-    size: 'medium',
     ariaKeyshortcuts: '/',
   },
   render: args => ({
@@ -98,8 +89,6 @@ export const WithKeyboardShortcut: Story = {
 
 export const Block: Story = {
   args: {
-    variant: 'primary',
-    size: 'medium',
     block: true,
   },
   render: args => ({

docs/content/2.guide/3.storybook.md

@@ -84,7 +84,6 @@ const props = withDefaults(
     /**
      * HTML button type attribute
      * @default "button"
-- `autodocs` usage is discouraged at this time, as it is buggy.
     type?: 'button' | 'submit'
     // ...
   }>)
@@ -108,3 +107,4 @@ Global application settings are added to the Storybook toolbar for easy testing
 - Changing `i18n` in the toolbar doesn't update the language. A manual story reload is required.
 - `autodocs` currently is non-functional due bugs, its usage is discouraged at this time.
 - `storybook` currently fails to build and must be viewed in the dev environment.
+- Sibling nuxt modules will generate many warnings and errors on `pnpm storybook`. Unless something breaks, just ignore them.

nuxt.config.ts

@@ -13,10 +13,9 @@ export default defineNuxtConfig({
     '@nuxt/fonts',
     'nuxt-og-image',
     '@nuxt/test-utils',
-    '@vite-pwa/nuxt',
     '@vueuse/nuxt',
     '@nuxtjs/i18n',
-    isStorybook ? undefined : '@nuxtjs/color-mode',
+    ...(isStorybook ? [] : ['@vite-pwa/nuxt', '@nuxtjs/color-mode']),
   ],
 
   $test: {