nrwl / nx

Smart Monorepos · Fast CI

Home Page:https://nx.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Errors when attempting to configure storybook

ErisDS opened this issue · comments

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.
  1. yarn nx g @nx/react:storybook-configuration @tryghost/admin-x-activitypub --verbose
  2. 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)
  1. 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.

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?