search

modernweb-dev / storybook-prebuilt

Storybook prebuilt to work with native es modules
MIT License
36 stars 9 forks source link

Watch flag doesn't seem to reload web components #20

Closed TomzBench closed 3 years ago

TomzBench commented 3 years ago

Hello,

I run the example-projects/storybook project except that I added the "--watch" flag when running storybook. I notice after doing this that the browser does reload, except the component does not update with the new changes. I think it might be related to the fact that the web components are still saved from prior to the code changes? Is the --watch flag supported when running storybook-prebuilt?

LarsDenBakker commented 3 years ago

Watch is supported, I just tried it and it works fine for me. What kind of code edits are you making? Maybe you are changing properties overwritten by the story args?

TomzBench commented 3 years ago

I changed MyElement.js:33

-- <h2>${this.title} Nr. ${this.counter}!</h2>
++ <h2>${this.title} foo ${this.counter}!</h2>

The browser reloaded as expected but the component still rendered the Nr.

(If I CTRL+C and restart, then the change is rendered)

LarsDenBakker commented 3 years ago

That works fine for me. Does the watch mode work for you in a regular project?

TomzBench commented 3 years ago

The issue is that the file watcher is not triggered correctly when using the VIM text editor. the solution that worked for me is adding the following to your .vimrc: 

set backupcopy=yes

See here for reference: https://github.com/webpack/webpack/issues/781#issuecomment-95523711

Thanks @LarsDenBakker for helping debug in chat.