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.

Does not work with yarn workspaces

See original GitHub issue

Describe the bug

When using in a project that is a yarn workspace (on a monorepo setup), the plugin fails to find modules because of node_modules being hoisted up to the root folder:

yarn storybook
yarn run v1.22.17
$ start-storybook -p 6006 -s public
info @storybook/react v6.4.18
info 
(node:61699) DeprecationWarning: --static-dir CLI flag is deprecated, see:

https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated---static-dir-cli-flag
(Use `node --trace-deprecation ...` to show where the warning was created)
info => Loading presets
info => Serving static files from ./public at /
info => Using implicit CSS loaders
ERR! Error: Cannot find module '<project-root>/storybook-addon-next/examples/with-tailwindcss/node_modules/next/package.json'
ERR! Require stack:
ERR! - <project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/utils.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/preset.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core-common/dist/cjs/presets.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core-common/dist/cjs/index.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core-server/dist/cjs/index.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core/dist/cjs/server.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core/server.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/react/dist/cjs/server/index.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/react/bin/index.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
ERR!     at Function.Module._load (node:internal/modules/cjs/loader:778:27)
ERR!     at Module.require (node:internal/modules/cjs/loader:1005:19)
ERR!     at require (node:internal/modules/cjs/helpers:102:18)
ERR!     at getNextjsVersion (<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/utils.js:9:1)
ERR!     at configureStaticImageImport (<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/images/webpack.js:14:50)
ERR!     at configureImages (<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/images/webpack.js:8:5)
ERR!     at <project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/preset.js:29:35
ERR!     at Generator.next (<anonymous>)
ERR!     at fulfilled (<project-root>/storybook-addon-next/examples/node_modules/tslib/tslib.js:114:62)
ERR!  Error: Cannot find module '<project-root>/storybook-addon-next/examples/with-tailwindcss/node_modules/next/package.json'
ERR! Require stack:
ERR! - <project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/utils.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/preset.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core-common/dist/cjs/presets.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core-common/dist/cjs/index.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core-server/dist/cjs/index.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core/dist/cjs/server.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/core/server.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/react/dist/cjs/server/index.js
ERR! - <project-root>/storybook-addon-next/examples/node_modules/@storybook/react/bin/index.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
ERR!     at Function.Module._load (node:internal/modules/cjs/loader:778:27)
ERR!     at Module.require (node:internal/modules/cjs/loader:1005:19)
ERR!     at require (node:internal/modules/cjs/helpers:102:18)
ERR!     at getNextjsVersion (<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/utils.js:9:1)
ERR!     at configureStaticImageImport (<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/images/webpack.js:14:50)
ERR!     at configureImages (<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/images/webpack.js:8:5)
ERR!     at <project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/preset.js:29:35
ERR!     at Generator.next (<anonymous>)
ERR!     at fulfilled (<project-root>/storybook-addon-next/examples/node_modules/tslib/tslib.js:114:62) {
ERR!   code: 'MODULE_NOT_FOUND',
ERR!   requireStack: [
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/utils.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/storybook-addon-next/dist/preset.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/core-common/dist/cjs/presets.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/core-common/dist/cjs/index.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/core-server/dist/cjs/index.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/core/dist/cjs/server.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/core/server.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/react/dist/cjs/server/index.js',
ERR!     '<project-root>/storybook-addon-next/examples/node_modules/@storybook/react/bin/index.js'
ERR!   ]
ERR! }

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Your minimal, reproducible example

https://github.com/volkyeth/storybook-addon-next/tree/broken-with-yarn-workspaces

Steps to reproduce

git clone --branch broken-with-yarn-workspaces git@github.com:volkyeth/storybook-addon-next.git
cd storybook-addon-next/examples
yarn install
cd with-tailwindcss
yarn storybook

Expected behavior

Package should work with yarn workspaces

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

OS: MacOS

storybook-addon-next version

1.4.2

Additional context

I’m not sure what’s the fix for this as I’m not very experienced at packaging libs. I’ll try to look into it but if someone knows how to make it compatible please advise and I’ll try to make a PR

Issue Analytics

State:
Created 2 years ago
Comments:22 (12 by maintainers)

Top GitHub Comments

2reactions

0xsvencommented, Feb 16, 2022

@volkyeth I am not using nohoist. All my dependencies are hoisted to the root folder.

From issue #22 it sounds like css-loader >6.0.0 is the issue. storybook-addon-next is still depending on it.

I downgraded to css-loader@5.2.7 and it works now! Thanks for the tips.

1reaction

RyanClementsHaxcommented, Feb 17, 2022

I was able to find a way to get package resolution working with #31. That being done, I’m still interested in any ideas to improve package management within this repo.

Also ty @illarionvk for the explanation.

Top Results From Across the Web

Bug: yarn workspaces in monorepo not working #8078 - GitHub

@MichaelJCole I use Yarn Workspaces at work and have now for the past year, with NO issues. Obviously, client is a quasar project....

Workspaces - Yarn

Workspaces are a new way to set up your package architecture that's available by default starting from Yarn 1.0. It allows you to...

Yarn 2 workspaces not installing dependencies - Stack Overflow

Create a .yarnrc.yml at the root of your monorepo,. Add the following property to it: nodeLinker: node-modules.

yarn workspaces linking is not working (#4744) · Issues - GitLab

We have a lerna monorepo with 2 packages utilizing yarn workspaces. The build script below executes successfully on our linux machines and linux ......

No yarn workspaces detected despite using workspaces for ...

Hello, netlify doesn't appear to be caching my node_modules properly and takes 3mins before each build retrieving dependencies. build does not fail just...