question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[6.2.0-rc] Breaks HMR for vue with imported modules

See original GitHub issue

Describe the bug Using storybook vue and the latest 6.2.0-rc10. Importing and using a function in a component works on the initial load after starting storybook. However, on changing something in the imported file, storybook breaks with the following error: TypeError: options is undefined (see screenshot below)

To Reproduce Steps to reproduce the behavior:

  1. Clone repository: https://github.com/thomasaull/storybook-hmr-bug
  2. npm run storybook
  3. Visit button story
  4. Go to stories/test.js and uncomment the last line

Expected behavior HMR should work for imported modules

Screenshots image

Code snippets Repository: https://github.com/thomasaull/storybook-hmr-bug Commit which adds the breaking example: https://github.com/thomasaull/storybook-hmr-bug/commit/8bd8f5a134601ec4aedc7cc5e06c049d3cdd90bc

System

Environment Info:

  System:
    OS: Linux 5.4 elementary OS 5.1.7 Hera
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
  Binaries:
    Node: 14.16.0 - ~/.nvm/versions/node/v14.16.0/bin/node
    npm: 6.14.11 - ~/.nvm/versions/node/v14.16.0/bin/npm
  Browsers:
    Chrome: 89.0.4389.90
    Firefox: 85.0.1
  npmPackages:
    @storybook/addon-actions: ^6.2.0-rc.10 => 6.2.0-rc.10 
    @storybook/addon-essentials: ^6.2.0-rc.10 => 6.2.0-rc.10 
    @storybook/addon-links: ^6.2.0-rc.10 => 6.2.0-rc.10 
    @storybook/vue: ^6.2.0-rc.10 => 6.2.0-rc.10 

Additional context

  • Does not occur with a vue-cli default setup
  • Does not occur with storybook 6.1.x

┆Issue is synchronized with this Asana task by Unito

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:8 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
shilmancommented, Mar 28, 2021

@thomasaull great detective work. can confirm that concatenateModules was NOT set in 6.1 and is currently being set in 6.2. Will discuss with @ndelangen and report back.

0reactions
thomasaullcommented, Mar 29, 2021

Awesome 😃 👍

Read more comments on GitHub >

github_iconTop Results From Across the Web

vuejs2 - Hot Module (HMR) doesnt work when config ...
I feel so helpless. I'm using @vue/cli@5.0.0-rc.0. The vue.config.js which exposes its modules looks like below,
Read more >
Migrating to 4.0 from 3.x
Installation process; TypeScript support; Bundles are now aligned with Vue 3; "createLogger" function is exported from the core module.
Read more >
@storybook/addon-storyshots | Yarn - Package Manager
6.2.0-rc.10 (March 26, 2021). NOTE: For Angular users using inline story rendering in addon-docs, this is a breaking prerelease change.
Read more >
Explore Hot Module Reloading integration of Vite with ...
HMR works as follows: A Node server serves the initial HTML page and initial versions of the JS/CSS/Vue files; The initial HTML page...
Read more >
Learn Vue 2: Part 17 - HMR - YouTube
Hot module replacement is incredibly cool. Yes, it will automatically refresh the page each time you change a component; however, ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found