search

storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
84.45k stars 9.28k forks source link

Storybook v6.4 is breaking users using react-router v5 #16837

Closed rhuanbarreto closed 2 years ago

rhuanbarreto commented 2 years ago

As storybook v6.4 brings react-router v6, people using v5 face breaking changes for a minor version update of storybook, which breaks semver.

Temporary solution is changing the version to ~6.3.12 instead of ^6.13.12 in the package.json file and putting "@storybook/router": "~6.3.10", in the resolution parameter of the package.json

And this breaking change is due to the storybook-addon-outline referenced in @storybook/addons-essentials. Follow the yarn why command. This package doesn't follow the fixed version nature of other storybook packages.

=> Found "react-router@6.0.2"
info Has been hoisted to "react-router"
info Reasons this module exists
   - Hoisted from "@storybook#addon-essentials#storybook-addon-outline#@storybook#addons#@storybook#router#react-router"
   - Hoisted from "@storybook#addon-essentials#storybook-addon-outline#@storybook#addons#@storybook#router#react-router-dom#react-router"
AngeloGiurano commented 2 years ago

@ndelangen Thanks for your input, I actually had both in my package.json, I had to remove node_modules and re-install and it worked!

Thanks @shilman for the quick fix for this

Sokolowska-Justyna commented 2 years ago

hi. i have upgraded storybook to https://github.com/storybookjs/storybook/releases/tag/v6.5.0-alpha.32 (issue with react-router 6 in other projects) After the upgrade, i have a problem with build-storybook. error: Field 'browser' doesn't contain a valid alias configuration storybook

node_modules/@storybook/theming/dist/cjs doesn't include any files. Does anyone have a similar issue?

yotavm commented 2 years ago

Hi, I just update to the new storybook 6.4.19 I still using React-router-dom 5 in my app and look like its try to use react-router 6 because storybook and my CRA is getting this error

Uncaught TypeError: Cannot read properties of undefined (reading 'pathname')
    at Router (index.tsx:284)
    at renderWithHooks (react-dom.development.js:14985)
    at mountIndeterminateComponent (react-dom.development.js:17811)
    at beginWork (react-dom.development.js:19049)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994)
    at invokeGuardedCallback (react-dom.development.js:4056)
    at beginWork$1 (react-dom.development.js:23964)
    at performUnitOfWork (react-dom.development.js:22776)
    at workLoopSync (react-dom.development.js:22707)
    at renderRootSync (react-dom.development.js:22670)
    at performSyncWorkOnRoot (react-dom.development.js:22293)
    at react-dom.development.js:11327
    at unstable_runWithPriority (scheduler.development.js:468)
    at runWithPriority$1 (react-dom.development.js:11276)
    at flushSyncCallbackQueueImpl (react-dom.development.js:11322)
    at flushSyncCallbackQueue (react-dom.development.js:11309)
    at scheduleUpdateOnFiber (react-dom.development.js:21893)
    at Object.enqueueSetState (react-dom.development.js:12467)
    at PersistGate.push.../../node_modules/react/cjs/react.development.js.Component.setState (react.development.js:365)
    at react.js:61
    at Object.dispatch (redux.js:297)
    at Object.rehydrate (persistStore.js:79)
    at _rehydrate (persistReducer.js:61)
    at persistReducer.js:90
nirapx commented 2 years ago

The same occurs even after upgrading to 6.5.0-beta.1 image

shilman commented 2 years ago

@nirapx do you have a reproduction you can share?

nirapx commented 2 years ago

@shilman 6.4.22 https://codesandbox.io/s/elegant-butterfly-i68jhp 6.5.0-beta.1 https://codesandbox.io/s/cranky-platform-m4bjy3

nirapx commented 2 years ago

any updates?

shilman commented 2 years ago

@nirapx when I remove the storybook dependencies & node_modules & lockfile and reinstall I get the same errors, so I don't think the problem is Storybook-related

nirapx commented 2 years ago

for some reason, after upgrading to the stable 6.5 version and removing lockfile, and reinstalling it worked for me. thank you :)