Errors when attempting to configure storybook

[ErisDS]

Current Behavior

We can't figure out how to setup storybook in our repo that already has nx setup.

npx storybook@latest init tells us to use nx, and then we get stuck

Expected Behavior

It should be possible to install & configure storybook using nx

GitHub Repo

https://github.com/TryGhost/Ghost

Steps to Reproduce

1. git clone git@github.com:TryGhost/Ghost.git
2. cd Ghost/apps/admin-x-activitypub
3. yarn
4. yarn add @nx/storybook --dev
5. yarn nx g @nx/storybook:configuration @tryghost/admin-x-activitypub
6. choose Y and react-vite
7. See the error as shown in the output

>  NX  Generating @nx/storybook:configuration

✔ Do you want to set up Storybook interaction tests? (Y/n) · true
✔ Choose the Storybook framework that you need to use. · @storybook/react-vite

 >  NX   The "path" argument must be of type string. Received undefined


TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at new NodeError (node:internal/errors:405:5)
    at validateString (node:internal/validators:162:11)
    at join (node:path:1171:7)
    at Object.<anonymous> (/Users/hannah/Sites/Ghost/node_modules/@nx/storybook/src/plugins/plugin.js:12:35)
    at Module._compile (/Users/hannah/Sites/Ghost/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
    at Module._extensions..js (node:internal/modules/cjs/loader:1422:10)
    at Module.load (node:internal/modules/cjs/loader:1203:32)
    at Module._load (node:internal/modules/cjs/loader:1019:12)
    at Module.require (node:internal/modules/cjs/loader:1231:19)
    at Mod.require (/Users/hannah/Sites/Ghost/node_modules/nx/bin/init-local.js:203:36)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

8. yarn nx g @nx/react:storybook-configuration @tryghost/admin-x-activitypub --verbose
9. Get a different error:

 >  NX   Unable to resolve @nx/react:storybook-configuration.

   unable to find tsconfig.base.json or tsconfig.json

Error: Unable to resolve @nx/react:storybook-configuration.
unable to find tsconfig.base.json or tsconfig.json
    at getGeneratorInformation (/Users/hannah/Sites/Ghost/node_modules/nx/src/command-line/generate/generator-utils.js:39:15)
    at /Users/hannah/Sites/Ghost/node_modules/nx/src/command-line/generate/generate.js:225:248
    at async handleErrors (/Users/hannah/Sites/Ghost/node_modules/nx/src/utils/params.js:9:16)

10. Note that there is a tsconfig.json in the local directory

Nx Report

>  NX   Report complete - copy this into the issue template

   Node   : 18.20.2
   OS     : darwin-arm64
   npm    : 9.9.3

   nx (global)    : 19.5.0
   nx             : 16.8.1
   @nx/js         : 19.5.0
   @nx/linter     : 19.5.0
   @nx/workspace  : 19.5.0
   @nx/cypress    : 19.5.0
   @nx/devkit     : 19.5.0
   @nx/storybook  : 19.5.0
   @nrwl/tao      : 16.8.1
   typescript     : 5.4.5
   ---------------------------------------
   The following packages should match the installed version of nx
     - @nx/js@19.5.0
     - @nrwl/js@19.5.0
     - @nx/linter@19.5.0
     - @nx/workspace@19.5.0
     - @nrwl/workspace@19.5.0
     - @nx/cypress@19.5.0
     - @nrwl/cypress@19.5.0
     - @nx/devkit@19.5.0
     - @nrwl/devkit@19.5.0
     - @nx/storybook@19.5.0
     - @nrwl/storybook@19.5.0

   To fix this, run `nx migrate nx@19.5.0`

✨  Done in 1.31s.

### Failure Logs

```shell
As above

Package Manager Version

yarn -v 1.22.22

Operating System

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

Additional Information

Not sure if this is related to #26914

This is possibly something really dumb, but we've had a few people look at it and can't figure it out. Any help would be much appreciated.

[Coly010]

The first error you are seeing:

>  NX  Generating @nx/storybook:configuration

✔ Do you want to set up Storybook interaction tests? (Y/n) · true
✔ Choose the Storybook framework that you need to use. · @storybook/react-vite

 >  NX   The "path" argument must be of type string. Received undefined


TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined

is happening because you've installed @nx/storybook at version 19.5.0 but your nx version is 16.8.1.

You will need to migrate Nx to latest version first. Could you try that and then try it again?

[github-actions]

This issue has been automatically marked as stale because no results of retrying on the latest version of Nx was provided within 7 days.
It will be closed in 21 days if no results are provided.
If the issue is still present, please reply to keep it active.
If the issue was not present, please close this issue.
Thanks for being a part of the Nx community! 🙏