Corrected failing example in Vue guide

[ffxsam]

This example failed out of the box. Registering every time is necessary, apparently

Issue:
Example in Vue guide threw errors on fresh install

What I did

Added component registration in every .add()

[vercel]

This pull request is automatically deployed with Now.
To access deployments, click Details below or on the icon next to each push.

Latest deployment for this branch: https://monorepo-git-fork-ffxsam-patch-2.storybook.now.sh

[shilman]

@backbone87 @elevatebart can you confirm? seems like a serious regression if this is correct...

[ndelangen]

@shilman The option for a single string was removed at some point in the past I think.

If it does still work, we should add it in the vue-kitchen-sink example, to make sure it stays working.

These are the option currently available for vue users.
https://github.com/storybooks/storybook/blob/next/examples/vue-kitchen-sink/src/stories/custom-rendering.stories.js#L9-L92

AFAIK, this should work with globally register components:

  .add('template', () => ({
    template: `
      <div>
        <h1>A template</h1>
        <p>rendered in vue in storybook</p>
      </div>`,
  }))

[elevatebart]

I believe the component MyButton is registered globally which makes these changes normally unnecessary.

I will check this immediately

[elevatebart]

If it is the case, the documentation needs urgent update. I need to check. Bart Ledoux Twitter: @bartledoux Github, Gitter, Discord: @elevatebart

…

On May 20, 2019, at 19:16, Norbert de Langen ***@***.***> wrote: @shilman No the option for a single string was removed at some point in the past. These are the option currently available for vue users. https://github.com/storybooks/storybook/blob/next/examples/vue-kitchen-sink/src/stories/custom-rendering.stories.js#L9-L92 AFAIK, this should work with globally register components: .add('template', () => ({ template: ` <div> <h1>A template</h1> <p>rendered in vue in storybook</p> </div>`, })) — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[ndelangen]

Did you find if this is necessary @elevatebart?

[elevatebart]

Not yet, I will check this in the coming hours. Bart Ledoux Twitter: @bartledoux Github, Gitter, Discord: @elevatebart

…

On May 23, 2019, at 04:10, Norbert de Langen ***@***.***> wrote: Did you find if this is necessary @elevatebart? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[elevatebart]

I just checked on next branch and all seems fine.
No need to update the docs.
The pure string story is still working fine in 5.1.0-rc.0.

@ffxsam you seem to have missed - so had I for the record - that in the guide, vue components are meant to be registered globally in the config.js file. It is only mentioned in the details sections. Maybe we should clarify this.

Does it make more sense now?

[ndelangen]

Thanks for all your detective work 🕵 @elevatebart 👍

[ndelangen]

@ffxsam thank you for helping! Super appreciated

[ffxsam]

@elevatebart

I just checked on next branch and all seems fine.
No need to update the docs.
The pure string story is still working fine in 5.1.0-rc.0.

@ffxsam you seem to have missed - so had I for the record - that in the guide, vue components are meant to be registered globally in the config.js file. It is only mentioned in the details sections. Maybe we should clarify this.

Ah, I did see this, but this intention was not clear. It states:

You might be using global components or vue plugins such as vuex, in that case you'll need to register them in this config.js file.

I would consider global components to be from plugins or other third party libraries such as Vuetify and Buefy. I don't consider my own internal components to be global at all (as I import them when necessary).

[backbone87]

we should update the storybook vue docs and explain what i wrote here: #6357 (comment)

storybook adds no magic regarding component registration