[@nrwl/storybook] Cannot find module '@storybook/html/package.json'

[airoude]

Current Behavior

When running the executor @nrwl/storybook:storybook with the following config it fails.

{
  "name": "web-components",
  "$schema": "../../node_modules/nx/schemas/project-schema.json",
  "sourceRoot": "packages/web-components/src",
  "projectType": "library",
  "targets": {
    "storybook": {
      "executor": "@nrwl/storybook:storybook",
      "options": {
        "uiFramework": "@storybook/html",
        "port": 4400,
        "configDir": "packages/web-components/.storybook"
      },
      "configurations": {
        "ci": {
          "quiet": true
        }
      }
    },
    "build.storybook": {
      "executor": "@nrwl/storybook:build",
      "outputs": ["{options.outputPath}"],
      "options": {
        "uiFramework": "@storybook/html",
        "outputPath": "dist/storybook/web-components",
        "configDir": "packages/web-components/.storybook"
      },
      "configurations": {
        "ci": {
          "quiet": true
        }
      }
    }
  }
}

Expected Behavior

To run without errors

Github Repo

No response

Steps to Reproduce

1. Setup nx repo with storybook and HTML ui
2. Run the @nrwl/storybook:storybook executor

Nx Report

Node : 16.18.0
   OS   : darwin x64
   npm  : 8.19.2

   nx : 15.5.0
   @nrwl/angular : Not Found
   @nrwl/cypress : 15.5.0
   @nrwl/detox : Not Found
   @nrwl/devkit : 15.5.0
   @nrwl/esbuild : Not Found
   @nrwl/eslint-plugin-nx : Not Found
   @nrwl/expo : Not Found
   @nrwl/express : Not Found
   @nrwl/jest : 15.5.0
   @nrwl/js : 15.5.0
   @nrwl/linter : 15.5.0
   @nrwl/nest : Not Found
   @nrwl/next : 15.5.0
   @nrwl/node : 15.5.0
   @nrwl/nx-cloud : Not Found
   @nrwl/nx-plugin : Not Found
   @nrwl/react : 15.5.0
   @nrwl/react-native : Not Found
   @nrwl/rollup : 15.5.0
   @nrwl/schematics : Not Found
   @nrwl/storybook : 15.5.0
   @nrwl/web : 15.5.0
   @nrwl/webpack : 15.5.0
   @nrwl/workspace : 15.5.0
   @nrwl/vite : Not Found
   typescript : 4.8.4
   ---------------------------------------
   Local workspace plugins:
   ---------------------------------------
   Community plugins:
     lerna: 6.4.1

Failure Logs

NX  ui framework: @storybook/html
 >  NX   Cannot find module '@storybook/html/package.json'

   Require stack:
   - /dev/project13/src/Frontend/node_modules/@nrwl/storybook/src/executors/utils.js
   - /dev/project13/src/Frontend/node_modules/@nrwl/storybook/src/executors/build-storybook/build-storybook.impl.js
   - /dev/project13/src/Frontend/node_modules/nx/src/config/workspaces.js
   - /dev/project13/src/Frontend/node_modules/nx/src/command-line/run.js
   - /dev/project13/src/Frontend/node_modules/nx/bin/run-executor.js
   Pass --verbose to see the stacktrace.

Additional Information

No response

[mandarini]

Hi there @airoude ! Did you try installing @storybook/html? That should solve your issue.

In any case, I need some more context. The app you use Storybook for, is it a web components app? If that's the case, then maybe you should use @storybook/web-components instead of @storybook/html. In any case, please try installing these packages, and it should fix your issue!

[mandarini]

With the next version of Nx, if you initialize with @storybook/html, the correct dependencies are going to be installed, don't worry.

[airoude]

@mandarini yes I have it installed. No, I don't need the @storybook/web-components. HTML one is sufficient enough.

[mandarini]

Hm I see. Can you please send me your repository? Or can you create a minimum reproduction repository?

[mandarini]

Also, one more question. Did you use nx migrate to migrate to the latest version? I see some target configs are not migrated.. And the version of your Storybook package is older. You need ^6.5.15. nx migrate takes care of these things...

[github-actions[bot]]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.