Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

sb migrate doesn't work #12020

Closed
henrycity opened this issue Aug 14, 2020 · 18 comments
Closed

sb migrate doesn't work #12020

henrycity opened this issue Aug 14, 2020 · 18 comments
Labels
cli has workaround inactive question / support

Comments

@henrycity
Copy link

henrycity commented Aug 14, 2020 •
edited
Loading

Describe the bug
I tried to migrate from storiesOf to CSF and the script couldn't run. I also had the same issue when running upgrade-hierarchy-separators.

To Reproduce
Run npx -p @storybook/cli@next sb migrate storiesof-to-csf --glob="**/*.stories.tsx"

Errors:

npx -p @storybook/cli@next sb migrate --parser=tsx storiesof-to-csf --glob="**/*.stories.tsx"
=> Applying storiesof-to-csf: 57 files
npx: installed 217 in 8.391s
Processing 57 files... 
Spawning 11 workers...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 6 files to free worker...
Sending 3 files to free worker...
/Users/henrycity/.npm/_npx/72712/lib/node_modules/@storybook/cli/node_modules/core-js/internals/global.js:13
check((typeof globalThis === "undefined" ? "undefined" : (0, _typeof2.default)(globalThis)) == 'object' && globalThis) || check((typeof window === "undefined" ? "undefined" : (0, _typeof2.default)(window)) == 'object' && window) || check((typeof self === "undefined" ? "undefined" : (0, _typeof2.default)(self)) == 'object' && self) || check((typeof global === "undefined" ? "undefined" : (0, _typeof2.default)(global)) == 'object' && global) || // eslint-disable-next-line no-new-func
                                                                              ^

TypeError: (0 , _typeof2.default) is not a function
    at Object.<anonymous> (/Users/henrycity/.npm/_npx/72712/lib/node_modules/@storybook/cli/node_modules/core-js/internals/global.js:8:9)
    at Module._compile (internal/modules/cjs/loader.js:1185:30)
    at Module._compile (/Users/henrycity/.npm/_npx/72734/lib/node_modules/jscodeshift/node_modules/pirates/lib/index.js:99:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:1205:10)
    at Object.newLoader [as .js] (/Users/henrycity/.npm/_npx/72734/lib/node_modules/jscodeshift/node_modules/pirates/lib/index.js:104:7)
    at Module.load (internal/modules/cjs/loader.js:1034:32)
    at Function.Module._load (internal/modules/cjs/loader.js:923:14)
    at Module.require (internal/modules/cjs/loader.js:1074:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (/Users/henrycity/.npm/_npx/72712/lib/node_modules/@storybook/cli/node_modules/core-js/internals/path.js:1:14)
/Users/henrycity/.npm/_npx/72712/lib/node_modules/@storybook/cli/node_modules/core-js/internals/global.js:13
check((typeof globalThis === "undefined" ? "undefined" : (0, _typeof2.default)(globalThis)) == 'object' && globalThis) || check((typeof window === "undefined" ? "undefined" : (0, _typeof2.default)(window)) == 'object' && window) || check((typeof self === "undefined" ? "undefined" : (0, _typeof2.default)(self)) == 'object' && self) || check((typeof global === "undefined" ? "undefined" : (0, _typeof2.default)(global)) == 'object' && global) || // eslint-disable-next-line no-new-func

All done. 
Results: 
0 errors
0 unmodified
0 skipped
0 ok

Expected behavior
All of the files are migrated to CSF.

Code snippets
If applicable, add code samples to help explain your problem.

System:
I cannot run npx sb@next info either.

I got this error

Environment Info:
(node:76369) UnhandledPromiseRejectionWarning: TypeError: (e || []).filter is not a function
    at /Users/henrycity/.npm/_npx/76369/lib/node_modules/sb/node_modules/envinfo/dist/envinfo.js:1:73314
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async Promise.all (index 6)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:76369) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:76369) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Though this is the system information I manually get

System:
    OS: macOS 10.15.6
  Binaries:
    Node: 14.0.0
    npm: 6.14.4
  npmPackages:
    "@storybook/addon-a11y": "6.0.5",
    "@storybook/addon-actions": "6.0.5",
    "@storybook/addon-docs": "^6.0.6",
    "@storybook/addon-jest": "6.0.5",
    "@storybook/addon-knobs": "6.0.5",
    "@storybook/addon-links": "6.0.5",
    "@storybook/addon-viewport": "6.0.5",
    "@storybook/preset-create-react-app": "^3.1.4",
    "@storybook/react": "6.0.5",
    "@storybook/theming": "6.0.5",
    "core-js": "^3.6.5",
@shilman
Copy link
Member

shilman commented Aug 14, 2020

what happens if you run npx sb@next info or npx sb@latest info?

@henrycity
Copy link
Author

what happens if you run npx sb@next info or npx sb@latest info?

I have this error when I run either of these commands

npx sb@latest info

Environment Info:
(node:81872) UnhandledPromiseRejectionWarning: TypeError: (e || []).filter is not a function
    at /Users/henry/.npm/_npx/81872/lib/node_modules/sb/node_modules/envinfo/dist/envinfo.js:1:73314
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
    at async Promise.all (index 6)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:81872) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:81872) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

@henrycity
Copy link
Author

henrycity commented Aug 14, 2020 •
edited
Loading

I just opened another ticket for the sb info issue (#12025)

@henrycity
Copy link
Author

henrycity commented Aug 15, 2020 •
edited
Loading

I got npx sb@latest info work and here is what it printed out

Environment Info:

  System:
    OS: macOS 10.15.6
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.6 - ~/.nvm/versions/node/v12.18.3/bin/npm
  Browsers:
    Chrome: 84.0.4147.125
    Firefox: 79.0
    Safari: 13.1.2
  npmPackages:
    @storybook/addon-a11y: 6.0.10 => 6.0.10
    @storybook/addon-actions: 6.0.10 => 6.0.10
    @storybook/addon-docs: ^6.0.10 => 6.0.10
    @storybook/addon-jest: 6.0.10 => 6.0.10
    @storybook/addon-knobs: 6.0.10 => 6.0.10
    @storybook/addon-links: 6.0.10 => 6.0.10
    @storybook/addon-viewport: 6.0.10 => 6.0.10
    @storybook/addons: ^6.0.10 => 6.0.10
    @storybook/preset-create-react-app: ^3.1.4 => 3.1.4
    @storybook/react: 6.0.10 => 6.0.10
    @storybook/theming: 6.0.10 => 6.0.10

Though I still had the same issue when running npx sb migrate storiesof-to-csf --glob="**/*.stories.tsx"

@alexandernanberg
Copy link

I'm getting a similar error

TypeError: $ is not a function
    at Object.<anonymous> (/Users/alna/.npm/_npx/42307/lib/node_modules/@storybook/cli/node_modules/core-js/modules/es.regexp.exec.js:5:1)
    at Module._compile (internal/modules/cjs/loader.js:1137:30)
    at Module._compile (/Users/alna/.npm/_npx/42314/lib/node_modules/jscodeshift/node_modules/pirates/lib/index.js:99:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:1157:10)
    at Object.newLoader [as .js] (/Users/alna/.npm/_npx/42314/lib/node_modules/jscodeshift/node_modules/pirates/lib/index.js:104:7)
    at Module.load (internal/modules/cjs/loader.js:985:32)
    at Function.Module._load (internal/modules/cjs/loader.js:878:14)
    at Module.require (internal/modules/cjs/loader.js:1025:19)
    at require (internal/modules/cjs/helpers.js:72:18)
    at Object.<anonymous> (/Users/alna/.npm/_npx/42307/lib/node_modules/@storybook/cli/node_modules/core-js/internals/fix-regexp-well-known-symbol-logic.js:3:1)

❯ npx sb@next info  

Environment Info:

  System:
    OS: macOS 10.15.6
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
  Binaries:
    Node: 12.18.3 - ~/.nvm/versions/node/v12.18.3/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.7 - ~/dev/decibel/node_modules/.bin/npm
  Browsers:
    Chrome: 84.0.4147.125
    Firefox: 79.0
    Safari: 13.1.2
  npmPackages:
    @storybook/addon-actions: 6.0.10 => 6.0.10 
    @storybook/addon-backgrounds: 6.0.10 => 6.0.10 
    @storybook/addon-docs: 6.0.10 => 6.0.10 
    @storybook/addon-knobs: 6.0.10 => 6.0.10 
    @storybook/addon-storysource: 6.0.10 => 6.0.10 
    @storybook/addons: 6.0.10 => 6.0.10 
    @storybook/react: 6.0.10 => 6.0.10 
    @storybook/theming: 6.0.10 => 6.0.10

@henrycity
Copy link
Author

henrycity commented Aug 17, 2020 •
edited
Loading

@alexandernanberg I just tried and removed @babel/preset-env from babel configuration. Let me know if that works for you too.

@alexandernanberg
Copy link

@henrycity Thanks, that worked! 🎉

@shilman
Copy link
Member

shilman commented Aug 17, 2020

@henrycity any idea what's going on here?

@henrycity
Copy link
Author

I read a similar issue in another library vercel/next.js#6879 and just tried that approach. Still can't find the root issue here.

@shilman
Copy link
Member

shilman commented Aug 18, 2020

So to confirm, current state is that everything works, but only with the workaround of removing @babel/preset-env? Or am I misunderstanding? Thanks for your hard work investigating this 🙏

@henrycity
Copy link
Author

Yeah, it works with that workaround. After I finished running sb migrate, I have to add @babel/preset-env again since I still need it.

@stale
Copy link

stale bot commented Sep 11, 2020

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

@stale stale bot added the inactive label Sep 11, 2020
@stale
Copy link

stale bot commented Oct 12, 2020

Hey there, it's me again! I am going close this issue to help our maintainers focus on the current development roadmap instead. If the issue mentioned is still a concern, please open a new ticket and mention this old one. Cheers and thanks for using Storybook!

@stale stale bot closed this as completed Oct 12, 2020
@tay1orjones
Copy link
Contributor

I had this same issue, but was able to work around it by running the command from one directory higher and modifying the glob as described in #7602 (comment)

npx -p @storybook/cli@next sb migrate csf-hoist-story-annotations --glob="my-project/**/*.stories.jsx"

@kelly-tock
Copy link

@henrycity where did you remove babel-preset-env?

Thanks!

@nickofthyme
Copy link

This still does not work for me with .tsx files, show 25 unmodified files. What am I doing wrong?

npx -p @storybook/cli@next sb migrate csf-hoist-story-annotations --glob="**/*.stories.tsx"

=> Applying csf-hoist-story-annotations: 25 files
Processing 25 files...
Spawning 15 workers...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 2 files to free worker...
Sending 1 files to free worker...
All done.
Results:
0 errors
25 unmodified
0 skipped
0 ok
Time elapsed: 1.427seconds

@shilman
Copy link
Member

shilman commented Jun 30, 2021

@nickofthyme do you want to create a new issue with a sample stories file and I can take a look?

@nickofthyme
Copy link

Sure thing. See #15442

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
cli has workaround inactive question / support
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@shilman @tay1orjones @alexandernanberg @henrycity @nickofthyme @kelly-tock