diff --git a/lib/cli/generators/ANGULAR/template-csf/src/stories/0-Welcome.stories.ts b/lib/cli/generators/ANGULAR/template-csf/src/stories/0-Welcome.stories.ts
index c15fa411f646..f506f387ca3c 100644
--- a/lib/cli/generators/ANGULAR/template-csf/src/stories/0-Welcome.stories.ts
+++ b/lib/cli/generators/ANGULAR/template-csf/src/stories/0-Welcome.stories.ts
@@ -2,6 +2,7 @@ import { Welcome } from '@storybook/angular/demo';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => ({
diff --git a/lib/cli/generators/ANGULAR/template-csf/src/stories/1-Button.stories.ts b/lib/cli/generators/ANGULAR/template-csf/src/stories/1-Button.stories.ts
index 7ff57f3af139..26c7fc6b40f8 100644
--- a/lib/cli/generators/ANGULAR/template-csf/src/stories/1-Button.stories.ts
+++ b/lib/cli/generators/ANGULAR/template-csf/src/stories/1-Button.stories.ts
@@ -5,6 +5,7 @@ import { Button } from '@storybook/angular/demo';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => ({
diff --git a/lib/cli/generators/ANGULAR/template-mdx/src/stories/0-Welcome.stories.mdx b/lib/cli/generators/ANGULAR/template-mdx/src/stories/0-Welcome.stories.mdx
index f7678421d17c..5fc361cd9b67 100644
--- a/lib/cli/generators/ANGULAR/template-mdx/src/stories/0-Welcome.stories.mdx
+++ b/lib/cli/generators/ANGULAR/template-mdx/src/stories/0-Welcome.stories.mdx
@@ -1,7 +1,7 @@
 import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { Welcome } from '@storybook/angular/demo';
 
-<Meta title="Welcome" />
+<Meta title="Welcome" component={Welcome} />
 
 # Welcome
 
diff --git a/lib/cli/generators/ANGULAR/template-mdx/src/stories/1-Button.stories.mdx b/lib/cli/generators/ANGULAR/template-mdx/src/stories/1-Button.stories.mdx
index a5f0b403a64e..2bfaa57e0afd 100644
--- a/lib/cli/generators/ANGULAR/template-mdx/src/stories/1-Button.stories.mdx
+++ b/lib/cli/generators/ANGULAR/template-mdx/src/stories/1-Button.stories.mdx
@@ -4,7 +4,7 @@ import { linkTo } from '@storybook/addon-links';
 
 import { Button } from '@storybook/angular/demo';
 
-<Meta title="Button" />
+<Meta title="Button" component={Button} />
 
 # Button
 
diff --git a/lib/cli/generators/MARKO/template-csf/stories/index.stories.js b/lib/cli/generators/MARKO/template-csf/stories/index.stories.js
index 2c64c94fab21..41fcb8b4fc12 100644
--- a/lib/cli/generators/MARKO/template-csf/stories/index.stories.js
+++ b/lib/cli/generators/MARKO/template-csf/stories/index.stories.js
@@ -2,6 +2,7 @@ import Welcome from './components/welcome/index.marko';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const welcome = () => ({ component: Welcome });
diff --git a/lib/cli/generators/METEOR/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/METEOR/template-csf/stories/0-Welcome.stories.js
index fe4de2145a69..fa267f24c316 100644
--- a/lib/cli/generators/METEOR/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/METEOR/template-csf/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import { Welcome } from '@storybook/react/demo';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
diff --git a/lib/cli/generators/METEOR/template-csf/stories/1-Button.stories.js b/lib/cli/generators/METEOR/template-csf/stories/1-Button.stories.js
index 2d2526055de9..ee421d08d5b0 100644
--- a/lib/cli/generators/METEOR/template-csf/stories/1-Button.stories.js
+++ b/lib/cli/generators/METEOR/template-csf/stories/1-Button.stories.js
@@ -4,6 +4,7 @@ import { Button } from '@storybook/react/demo';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
diff --git a/lib/cli/generators/MITHRIL/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/MITHRIL/template-csf/stories/0-Welcome.stories.js
index 3de233b222b4..3514edb1c9b4 100644
--- a/lib/cli/generators/MITHRIL/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/MITHRIL/template-csf/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import Welcome from './Welcome';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => ({
diff --git a/lib/cli/generators/MITHRIL/template-csf/stories/1-Button.stories.js b/lib/cli/generators/MITHRIL/template-csf/stories/1-Button.stories.js
index f425932490d3..770c8b9d95fe 100644
--- a/lib/cli/generators/MITHRIL/template-csf/stories/1-Button.stories.js
+++ b/lib/cli/generators/MITHRIL/template-csf/stories/1-Button.stories.js
@@ -4,6 +4,7 @@ import Button from './Button';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => ({
diff --git a/lib/cli/generators/PREACT/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/PREACT/template-csf/stories/0-Welcome.stories.js
index 0d0669ee4076..03442e51b929 100644
--- a/lib/cli/generators/PREACT/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/PREACT/template-csf/stories/0-Welcome.stories.js
@@ -6,6 +6,7 @@ import Welcome from './Welcome';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
diff --git a/lib/cli/generators/PREACT/template-csf/stories/1-Button.stories.js b/lib/cli/generators/PREACT/template-csf/stories/1-Button.stories.js
index c4c4e533038c..650c1a6d2a6f 100644
--- a/lib/cli/generators/PREACT/template-csf/stories/1-Button.stories.js
+++ b/lib/cli/generators/PREACT/template-csf/stories/1-Button.stories.js
@@ -6,6 +6,7 @@ import Button from './Button';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
diff --git a/lib/cli/generators/RAX/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/RAX/template-csf/stories/0-Welcome.stories.js
index 2f50a78ee5f3..7f3dddec5d41 100644
--- a/lib/cli/generators/RAX/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/RAX/template-csf/stories/0-Welcome.stories.js
@@ -5,6 +5,7 @@ import Welcome from './Welcome';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button', 'with text')} />;
diff --git a/lib/cli/generators/REACT/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/REACT/template-csf/stories/0-Welcome.stories.js
index fe4de2145a69..fa267f24c316 100644
--- a/lib/cli/generators/REACT/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/REACT/template-csf/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import { Welcome } from '@storybook/react/demo';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
diff --git a/lib/cli/generators/REACT/template-csf/stories/1-Button.stories.js b/lib/cli/generators/REACT/template-csf/stories/1-Button.stories.js
index 2d2526055de9..ee421d08d5b0 100644
--- a/lib/cli/generators/REACT/template-csf/stories/1-Button.stories.js
+++ b/lib/cli/generators/REACT/template-csf/stories/1-Button.stories.js
@@ -4,6 +4,7 @@ import { Button } from '@storybook/react/demo';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
diff --git a/lib/cli/generators/REACT/template-mdx/stories/0-Welcome.stories.mdx b/lib/cli/generators/REACT/template-mdx/stories/0-Welcome.stories.mdx
index 15e55744b619..8f48008a3b56 100644
--- a/lib/cli/generators/REACT/template-mdx/stories/0-Welcome.stories.mdx
+++ b/lib/cli/generators/REACT/template-mdx/stories/0-Welcome.stories.mdx
@@ -2,7 +2,7 @@ import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '@storybook/react/demo';
 
-<Meta title="Welcome" />
+<Meta title="Welcome" component={Welcome} />
 
 # Welcome
 
diff --git a/lib/cli/generators/REACT/template-mdx/stories/1-Button.stories.mdx b/lib/cli/generators/REACT/template-mdx/stories/1-Button.stories.mdx
index 8cd965a1e074..ed90840f9dcb 100644
--- a/lib/cli/generators/REACT/template-mdx/stories/1-Button.stories.mdx
+++ b/lib/cli/generators/REACT/template-mdx/stories/1-Button.stories.mdx
@@ -2,7 +2,7 @@ import { action } from '@storybook/addon-actions';
 import { Button } from '@storybook/react/demo';
 import { Meta, Story } from '@storybook/addon-docs/blocks';
 
-<Meta title="Button" />
+<Meta title="Button" component={Button} />
 
 # Button
 
diff --git a/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/0-Welcome.stories.tsx b/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/0-Welcome.stories.tsx
index fe4de2145a69..fa267f24c316 100644
--- a/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/0-Welcome.stories.tsx
+++ b/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/0-Welcome.stories.tsx
@@ -4,6 +4,7 @@ import { Welcome } from '@storybook/react/demo';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
diff --git a/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/1-Button.stories.tsx b/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/1-Button.stories.tsx
index 2d2526055de9..ee421d08d5b0 100644
--- a/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/1-Button.stories.tsx
+++ b/lib/cli/generators/REACT_SCRIPTS/template-csf-ts/src/stories/1-Button.stories.tsx
@@ -4,6 +4,7 @@ import { Button } from '@storybook/react/demo';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
diff --git a/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/0-Welcome.stories.js b/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/0-Welcome.stories.js
index fe4de2145a69..fa267f24c316 100644
--- a/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import { Welcome } from '@storybook/react/demo';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
diff --git a/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/1-Button.stories.js b/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/1-Button.stories.js
index 2d2526055de9..ee421d08d5b0 100644
--- a/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/1-Button.stories.js
+++ b/lib/cli/generators/REACT_SCRIPTS/template-csf/src/stories/1-Button.stories.js
@@ -4,6 +4,7 @@ import { Button } from '@storybook/react/demo';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
diff --git a/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/0-Welcome.stories.mdx b/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/0-Welcome.stories.mdx
index 15e55744b619..8f48008a3b56 100644
--- a/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/0-Welcome.stories.mdx
+++ b/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/0-Welcome.stories.mdx
@@ -2,7 +2,7 @@ import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '@storybook/react/demo';
 
-<Meta title="Welcome" />
+<Meta title="Welcome" component={Welcome} />
 
 # Welcome
 
diff --git a/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/1-Button.stories.mdx b/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/1-Button.stories.mdx
index 9bbcc904f99b..7c87b32323cd 100644
--- a/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/1-Button.stories.mdx
+++ b/lib/cli/generators/REACT_SCRIPTS/template-mdx/src/stories/1-Button.stories.mdx
@@ -2,7 +2,7 @@ import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { action } from '@storybook/addon-actions';
 import { Button } from '@storybook/react/demo';
 
-<Meta title="Button" />
+<Meta title="Button" component={Button} />
 
 # Button
 
diff --git a/lib/cli/generators/SFC_VUE/template-csf/src/stories/0-Welcome.stories.js b/lib/cli/generators/SFC_VUE/template-csf/src/stories/0-Welcome.stories.js
index 2baaf0433841..6be3fcf848cb 100644
--- a/lib/cli/generators/SFC_VUE/template-csf/src/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/SFC_VUE/template-csf/src/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import Welcome from './Welcome.vue';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => ({
diff --git a/lib/cli/generators/SFC_VUE/template-csf/src/stories/1-Button.stories.js b/lib/cli/generators/SFC_VUE/template-csf/src/stories/1-Button.stories.js
index ca61ba316570..69eb65389e63 100644
--- a/lib/cli/generators/SFC_VUE/template-csf/src/stories/1-Button.stories.js
+++ b/lib/cli/generators/SFC_VUE/template-csf/src/stories/1-Button.stories.js
@@ -5,6 +5,7 @@ import MyButton from './MyButton.vue';
 
 export default {
   title: 'Button',
+  component: MyButton,
 };
 
 export const text = () => ({
diff --git a/lib/cli/generators/SFC_VUE/template-mdx/src/stories/0-Welcome.stories.mdx b/lib/cli/generators/SFC_VUE/template-mdx/src/stories/0-Welcome.stories.mdx
index 36fb42a282db..bcf64d1f659d 100644
--- a/lib/cli/generators/SFC_VUE/template-mdx/src/stories/0-Welcome.stories.mdx
+++ b/lib/cli/generators/SFC_VUE/template-mdx/src/stories/0-Welcome.stories.mdx
@@ -2,7 +2,7 @@ import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { linkTo } from '@storybook/addon-links';
 import Welcome from './Welcome.vue';
 
-<Meta title="Welcome" />
+<Meta title="Welcome" component={Welcome} />
 
 # Welcome
 
diff --git a/lib/cli/generators/SFC_VUE/template-mdx/src/stories/1-Button.stories.mdx b/lib/cli/generators/SFC_VUE/template-mdx/src/stories/1-Button.stories.mdx
index 780ca5c9e881..f37647542ac2 100644
--- a/lib/cli/generators/SFC_VUE/template-mdx/src/stories/1-Button.stories.mdx
+++ b/lib/cli/generators/SFC_VUE/template-mdx/src/stories/1-Button.stories.mdx
@@ -3,7 +3,7 @@ import { action } from '@storybook/addon-actions';
 import { linkTo } from '@storybook/addon-links';
 import MyButton from './MyButton.vue';
 
-<Meta title="Button" />
+<Meta title="Button" component={MyButton} />
 
 # Button
 
diff --git a/lib/cli/generators/SVELTE/template-csf/stories/index.stories.js b/lib/cli/generators/SVELTE/template-csf/stories/index.stories.js
index f3b01a4ce26a..d200a570fd3b 100644
--- a/lib/cli/generators/SVELTE/template-csf/stories/index.stories.js
+++ b/lib/cli/generators/SVELTE/template-csf/stories/index.stories.js
@@ -4,6 +4,7 @@ import Button from './button.svelte';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => ({
diff --git a/lib/cli/generators/VUE/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/VUE/template-csf/stories/0-Welcome.stories.js
index 81a7eadc71f5..e796e4824d3e 100644
--- a/lib/cli/generators/VUE/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/VUE/template-csf/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import Welcome from './Welcome';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => ({
diff --git a/lib/cli/generators/VUE/template-csf/stories/1-Button.stories.js b/lib/cli/generators/VUE/template-csf/stories/1-Button.stories.js
index 563686e89f26..5560968ea542 100644
--- a/lib/cli/generators/VUE/template-csf/stories/1-Button.stories.js
+++ b/lib/cli/generators/VUE/template-csf/stories/1-Button.stories.js
@@ -5,6 +5,7 @@ import MyButton from './MyButton';
 
 export default {
   title: 'Button',
+  component: MyButton,
 };
 
 export const text = () => ({
diff --git a/lib/cli/generators/VUE/template-mdx/stories/0-Welcome.stories.mdx b/lib/cli/generators/VUE/template-mdx/stories/0-Welcome.stories.mdx
index c20f9e6c6880..5614c5ccc556 100644
--- a/lib/cli/generators/VUE/template-mdx/stories/0-Welcome.stories.mdx
+++ b/lib/cli/generators/VUE/template-mdx/stories/0-Welcome.stories.mdx
@@ -2,7 +2,7 @@ import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { linkTo } from '@storybook/addon-links';
 import Welcome from './Welcome';
 
-<Meta title="Welcome" />
+<Meta title="Welcome" component={Welcome} />
 
 # Welcome
 
diff --git a/lib/cli/generators/VUE/template-mdx/stories/1-Button.stories.mdx b/lib/cli/generators/VUE/template-mdx/stories/1-Button.stories.mdx
index 9385d0184a98..ba6df7f248f2 100644
--- a/lib/cli/generators/VUE/template-mdx/stories/1-Button.stories.mdx
+++ b/lib/cli/generators/VUE/template-mdx/stories/1-Button.stories.mdx
@@ -3,7 +3,7 @@ import { action } from '@storybook/addon-actions';
 import { linkTo } from '@storybook/addon-links';
 import MyButton from './MyButton';
 
-<Meta title="Button" />
+<Meta title="Button" component={MyButton} />
 
 # Button
 
diff --git a/lib/cli/generators/WEBPACK_REACT/template-csf/stories/0-Welcome.stories.js b/lib/cli/generators/WEBPACK_REACT/template-csf/stories/0-Welcome.stories.js
index fe4de2145a69..fa267f24c316 100644
--- a/lib/cli/generators/WEBPACK_REACT/template-csf/stories/0-Welcome.stories.js
+++ b/lib/cli/generators/WEBPACK_REACT/template-csf/stories/0-Welcome.stories.js
@@ -4,6 +4,7 @@ import { Welcome } from '@storybook/react/demo';
 
 export default {
   title: 'Welcome',
+  component: Welcome,
 };
 
 export const toStorybook = () => <Welcome showApp={linkTo('Button')} />;
diff --git a/lib/cli/generators/WEBPACK_REACT/template-csf/stories/1-Button.stories.js b/lib/cli/generators/WEBPACK_REACT/template-csf/stories/1-Button.stories.js
index ebee8e0c1c99..7f31c9b92bcb 100644
--- a/lib/cli/generators/WEBPACK_REACT/template-csf/stories/1-Button.stories.js
+++ b/lib/cli/generators/WEBPACK_REACT/template-csf/stories/1-Button.stories.js
@@ -5,6 +5,7 @@ import { Button } from '@storybook/react/demo';
 
 export default {
   title: 'Button',
+  component: Button,
 };
 
 export const text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
diff --git a/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/0-Welcome.stories.mdx b/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/0-Welcome.stories.mdx
index 15e55744b619..8f48008a3b56 100644
--- a/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/0-Welcome.stories.mdx
+++ b/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/0-Welcome.stories.mdx
@@ -2,7 +2,7 @@ import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
 import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '@storybook/react/demo';
 
-<Meta title="Welcome" />
+<Meta title="Welcome" component={Welcome} />
 
 # Welcome
 
diff --git a/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/1-Button.stories.mdx b/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/1-Button.stories.mdx
index 8cd965a1e074..876782206a82 100644
--- a/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/1-Button.stories.mdx
+++ b/lib/cli/generators/WEBPACK_REACT/template-mdx/stories/1-Button.stories.mdx
@@ -1,8 +1,8 @@
+import { Meta, Story } from '@storybook/addon-docs/blocks';
 import { action } from '@storybook/addon-actions';
 import { Button } from '@storybook/react/demo';
-import { Meta, Story } from '@storybook/addon-docs/blocks';
 
-<Meta title="Button" />
+<Meta title="Button" component={Button} />
 
 # Button