@nx/storybook:configuration with --uiFramework=@storybook/web-components-vite fails on 404 dependency

[jbelik]

Current Behavior

Executing nx g @nx/storybook:configuration project-name --uiFramework=@storybook/web-components-vite fails with error, as it adds an dependency for @storybook/web which does not exist. I thought I can workaround this by removing the dependency but a side effect of this issue is that the generator doesn't complete the remaining steps one of which is adding new targets to the project.json...

Here is the error log:

pnpm nx g @nx/storybook:configuration stencil-core --uiFramework=@storybook/web-components-vite

 NX  Generating @nx/storybook:configuration

√ Do you want to set up Storybook interaction tests? (Y/n) · true
Storybook configuration files already exist for stencil-core!
tsconfig.storybook.json already exists for this project
UPDATE package.json
Scope: all 4 workspace projects
 WARN  deprecated @storybook/[email protected]: In Storybook 8, this package functionality has been integrated to a new package called @storybook/test, which uses Vitest APIs for an improved experience. When upgrading to Storybook 8 with 'npx storybook@latest upgrade', you will get prompted and will get an automigration for the new package. Please migrate when you can.
 WARN  deprecated @storybook/[email protected]: In Storybook 8, this package functionality has been integrated to a new package called @storybook/test, which uses Vitest APIs for an improved experience. When upgrading to Storybook 8 with 'npx storybook@latest upgrade', you will get prompted and will get an automigration for the new package. Please migrate when you can.
 ERR_PNPM_FETCH_404  GET https://registry.npmjs.org/@storybook%2Fweb: Not Found - 404

This error happened while installing a direct dependency of C:\SOFTWARE\GIT PROJECTS\web-components-library

@storybook/web is not in the npm registry, or you have no permission to fetch it.

No authorization header was set for the request.
Progress: resolved 60, reused 60, downloaded 0, added 0

 NX   Command failed: pnpm install --no-frozen-lockfile

Expected Behavior

Executing nx g @nx/storybook:configuration project-name --uiFramework=@storybook/web-components-vite will succesfully complete all the steps outlined in https://nx.dev/nx-api/storybook:

Choosing one of these frameworks will have the following effects on your workspace:

• Nx will install all the required Storybook packages that go with it.

• Nx will generate a project-level .storybook folder (located under libs/your-project/.storybook or apps/your-project/.storybook) containing the essential configuration files for Storybook.

• Nx will create new targets in your project's project.json, called storybook, test-storybook and build-storybook, containing all the necessary configuration to serve, test and build Storybook.

GitHub Repo

No response

Steps to Reproduce

1. Execute nx g @nx/storybook:configuration project-name --uiFramework=@storybook/web-components-vite
2. Observe terminal output

Nx Report

Node           : 22.11.0
OS             : win32-x64
Native Target  : x86_64-windows
pnpm           : 10.9.0

nx                     : 21.1.0
@nx/js                 : 21.1.0
@nx/eslint             : 21.1.0
@nx/workspace          : 21.1.0
@nx/angular            : 21.1.0
@nx/cypress            : 21.1.0
@nx/devkit             : 21.1.0
@nx/eslint-plugin      : 21.1.0
@nx/module-federation  : 21.1.0
@nx/rspack             : 21.1.0
@nx/storybook          : 21.1.0
@nx/vite               : 21.1.0
@nx/web                : 21.1.0
@nx/webpack            : 21.1.0
typescript             : 5.7.3
---------------------------------------
Registered Plugins:
@nx/storybook/plugin
---------------------------------------
Community plugins:
angular-eslint : 19.4.0
---------------------------------------
Cache Usage: 0.00 B / 47.58 GB

Failure Logs

Package Manager Version

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

Interestingly enough, when I manually remove the @storybook/web dependency, run pnpm install and set up the Storybook target in project.json myself, runnign the target fails with this error:

> nx run stencil-core:storybook-start

Option "uiFramework" is deprecated: Upgrade to Storybook 7.
NX   Property 'uiFramework' does not match the schema. '@storybook/web-components-vite' should be one of @storybook/react,@storybook/html,@storybook/web-components,@storybook/vue,@storybook/vue3,@storybook/svelte.

So it seems that uiFramework=@storybook/web-components-vite is no longer supported? But the latest documentation at https://nx.dev/nx-api/storybook still has it there...
I thought maybe I just run nx g @nx/storybook:configuration project-name --uiFramework=@storybook/web-components but that fails with:

 NX   Property 'uiFramework' does not match the schema. '@storybook/web-components' should be one of @storybook/angular,@storybook/html-webpack5,@storybook/nextjs,@storybook/preact-webpack5,@sto
rybook/react-webpack5,@storybook/react-vite,@storybook/server-webpack5,@storybook/svelte-webpack5,@storybook/svelte-vite,@storybook/sveltekit,@storybook/vue-webpack5,@storybook/vue-vite,@storybook/vue3-webpack5,@storybook/vue3-vite,@storybook/web-components-webpack5,@storybook/web-components-vite.

So I really don't know how to solve this