Storybook 插件：组件源代码

Storybook 插件组件源代码允许你在 storybook 插件面板中查看你的组件模板。

框架支持：Vue, React (即将推出...)

开始使用

yarn add -D component-source

然后在你的 Storybook 配置中创建一个名为 addons.js 的文件。

将以下内容添加到其中

// register the notes addon as a tab
import 'component-source/register';

现在，你可以使用 source 参数为每个 story 添加注释。

Vue

import { storiesOf } from '@storybook/vue';

import MyButton from '../src/components/MyButton.vue';

storiesOf('MyButton', module).add(
  'with some emoji',
  () => ({
    components: { MyButton },
    template: '<my-button>😀 😎 👍 💯</my-button>',
  }),
  { 
      source: {
        // Note: Path should be start from /src/ and must be end with file extension
           publicPath:'/src/components/MyButton.vue'
      },
  }
);