2017-06-19 29 views
1

我不能似乎得到了@storybook插件旋钮工作?它似乎并没有装饰实际的故事。几乎其次this反应童话插件旋钮没有显示

我下面的代码..进出口使用getstorybook与创造 - 反应 - 应用

使用下面的包:

@storybook/addon-actions": "^3.1.2, 
@storybook/addon-info": "^3.1.4, 
@storybook/addon-knobs": "^3.1.2, 
@storybook/react": "^3.1.3 

我的设置

//.storybook/addons.js 
import '@storybook/addon-knobs/register' 

//.config 
import { configure, setAddon, addDecorator } from '@storybook/react'; 
import infoAddon from '@storybook/addon-info'; 

setAddon(infoAddon); 

function loadStories() { 
    require('../stories'); 
} 

configure(loadStories, module); 

//stories/index.js 
import React from 'react'; 
import { withKnobs, text, boolean, number } from '@storybook/addon-knobs'; 
import { storiesOf } from '@storybook/react'; 

const stories = storiesOf('Storybook Knobs', module); 

    // Add the `withKnobs` decorator to add knobs support to your stories. 
    // You can also configure `withKnobs` as a global decorator. 
    stories.addDecorator(withKnobs); 

    // Knobs for React props 
    stories.add('with a button',() => (
    <button disabled={boolean('Disabled', false)} > 
     {text('Label', 'Hello Button')} 
    </button> 
)) 

这应该是一个没有理智,但没有吸运气。

回答

-1

你可能需要创建的故事书config文件夹中addons.js文件。 (默认情况下为.storybook)。

检查addon notes你需要添加以下内容:

import '@storybook/addon-notes/register'; 
+0

为什么downvote?我挂了笔记和缺少插件寄存器是由常见的错误人们所做的旋钮不会显示。另外我说可能需要 – FabioCosta

0

尝试在URL

如移除所有的查询字符串。 http://localhost:6006/?knob-is_block=false&knob-Disabled=false&knob-disabled=false&knob-Style%20lite=false&knob-show=true&knob-Size=md&knob-readOnly=false&knob-Style=default&knob-icon%20name=vertical&knob-Label=Hello%20Button&knob-Active=false&knob-is_loading=false&selectedKind=Button&selectedStory=default%20style&full=0&addons=0&stories=1&panelRight=0&addonPanel=storybooks%2Fstorybook-addon-knobs

http://localhost:6006

这为我工作。