npx sb init doesn't work for monorepos

[airtonix]

Describe the bug website no longer describes manual install.

To Reproduce Steps to reproduce the behavior:

1. Go to https://storybook.js.org/docs/react/get-started/install
2. see that there is only npx sb init

Expected behavior

• document the packages required.
• yarn add -DW ...packages

Screenshots If applicable, add screenshots to help explain your problem.

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

System Please paste the results of npx sb@next info here.

❯ npx sb@next info

Environment Info:

  System:
    OS: Linux 5.8 Fedora 33 (Workstation Edition) 33 (Workstation Edition)
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
  Binaries:
    Node: 12.19.0 - ~/.nvm/versions/node/v12.19.0/bin/node
    Yarn: 1.22.10 - ~/.nvm/versions/node/v12.19.0/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v12.19.0/bin/npm
  Browsers:
    Chrome: 86.0.4240.111
    Firefox: 82.0
  npmPackages:
    @storybook/addon-essentials: ^6.0.28 => 6.0.28 
    @storybook/react: ^6.0.28 => 6.0.28 

I've just tried manually installing pacakages... so that's why you see

@storybook/addon-essentials: ^6.0.28 => 6.0.28 
    @storybook/react: ^6.0.28 => 6.0.28 

Additional context

• mixed typescript and babel monorepo (not using babel-typescript-preset malarky)
• lerna
• yarn workspaces

[JacquesBonet]

Work perfectly if we remove this line in .storybook/main.js

"@storybook/preset-create-react-app"

[OldrichDlouhy]

For pnpm package manager, trying the pnpx sb init results in error Unsupported URL Type "workspace:": workspace:1.0.0 when the package contains dependencies for other packages in the monorepo.

[jesperp]

Also an issue for pnpm as previous commenter mentioned.

When running pnpx sb init / upgrade:

 • Installing upgrades • Preparing to install dependencies. ✓

npm ERR! code EUNSUPPORTEDPROTOCOL
npm ERR! Unsupported URL Type "workspace:": workspace:*

Running pnpm i to manually afterwards seems to work though. Not sure if sb is suppose to do anything important after trying to install deps

[jesperp]

For now these steps should work to setup a package in a monorepo (I'm using Svelte & pnpm):

mkdir monorepo-package
pnpm init
pnpm i svelte              # To make SB recognize the package as a svelte project
pnpx sb init -s            # Don’t install packages, only setup the files/folders/package.json
pnpm i                     # Manually install the new deps
pnpm i -D @storybook/cli   # Also need this for start-storybook command
pnpm storybook

[ghost]

any updates?

[unknownterritory]

This issue seems to be caused by Webpack only reading loaders from the working directory and not following symlinks. Webpack 5 might solve this but it is still experimental in SB. A possible solution suggested would require SB to change its Webpack < 5 configuration to use require.resolve() for all loader references instead of plain require(). See suggestion in the original Webpack thread comment.

[shilman]

@unknownterritory FWIW webpack5 support is mostly stable as of the 6.3 release

[airtonix]

this is still a problem.

i'm now in a yarn2 monorepo and the problem is that someone on npmjs has created a package that also provides the sb bin and they win over storybook presumable because 🤷🏻 ... (would be nice to have a search facet on npmjs that reveals packages providing a bin)

so yeah... I can literally not even use the install command now.

[azuldev1]

anyone find a work around for this issue? I too am trying to use yarn Berry/workspaces (monorepo) with npx sb and having no luck.

[singhinderpal]

I think my issue discussion#477 is related to this! Any help?

[IanVS]

pnpm support has been greatly improved in Storybook 7.0. During installation, we attempt to detect which package manager to use to install dependencies based on what kind of lock file you have in the project. It can sometimes get it wrong, so if you want to force a particular package manager, you can use a --package-manager flag when using npx sb@next (or pnpx sb@next). For example, you could use npx sb@next init --package-manager=yarn.

Please let us know if you continue to have issues installing storybook in monorepos, but I believe this issue is resolved unless I hear otherwise.

[haf]

On a pnpm repo, running pnpx storybook init crashes with

 • Detecting project type. ✓
 • Adding Storybook support to your "Webpack React" app

attention => Storybook now collects completely anonymous telemetry regarding usage.
This information is used to shape Storybook's roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://storybook.js.org/telemetry

npm ERR! code EUNSUPPORTEDPROTOCOL
npm ERR! Unsupported URL Type "workspace:": workspace:0.0.1

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/h/.npm/_logs/2023-02-19T16_08_08_179Z-debug-0.log
An error occurred while installing dependencies.

 ERROR  Command failed with exit code 1: storybook init

pnpm: Command failed with exit code 1: storybook init
    at makeError (/Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:22883:17)
    at handlePromise (/Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:23454:33)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Object.handler [as dlx] (/Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:212276:7)
    at async /Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:219780:21
    at async main (/Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:219751:34)
    at async runPnpm (/Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:219979:5)
    at async /Users/h/.cache/node/corepack/pnpm/7.23.0/dist/pnpm.cjs:219971:7

[IanVS]

@haf, please use storybook 7. It is still in beta, so you need to use pnpx storybook@next init.