Storybook: TypeError: Cannot set property 'storybook' of undefined from npx -p @storybook/cli sb init

[levelingup]

I tried to follow the initial steps from here: https://www.learnstorybook.com/intro-to-storybook/react/en/get-started/

running:

npx create-react-app taskbox
cd taskbox

Then when I ran:
npx -p @storybook/cli sb init

I get the error TypeError: Cannot set property 'storybook' of undefined

This is the full message in my terminal:

 sb init - the simplest way to add a storybook to your project. 

 • Detecting project type. ✓
 • Adding storybook support to your "Create React App" based project
     TypeError: Cannot set property 'storybook' of undefined
    at default (/Users/levelingup/.npm/_npx/2358/lib/node_modules/@storybook/cli/generators/REACT_SCRIPTS/index.js:29:33)
    at process._tickCallback (internal/process/next_tick.js:68:7)

running npx --version: 6.9.0

[shilman]

Are you sure you're running that inside the taskbox directory?

[levelingup]

Are you sure you're running that inside the taskbox directory?

Yup, i was in the directory when I ran npx -p @storybook/cli sb init

[shilman]

The line that errored is trying to add something to the scripts field of package.json. Can you check to see if your package.json has a scripts field? Mine does when I try to repro.

[levelingup]

No scripts field. Only thing in my package.json:

{
  "name": "taskbox",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-scripts": "3.3.0"
  }
}

[BanlyTong]

I encountered the same problem.
It caused because I installed create-react-app globally, so npx didn't use the latest version of cra.

The problem was solved after I uninstalled the global create-react-app package.
And here is how to do it.

[shilman]

I think the CLI should be smart enough to add a scripts section to your package.json if there isn't one. Great first issue if somebody wants to take it!

[Manish-Giri]

Hello, I would like to give this a shot..

[emileber]

@Manish-Giri While you're at it, it would be great if the CLI failed gracefully when there is no package.json at all. While really uncommon, right now, it crashes with the following error.

TypeError: Cannot create property 'dependencies' on boolean 'false'

I think it comes from the following lines:

  const packageJson = await retrievePackageJson();
  // missing a check here and a helpful error message.
  packageJson.dependencies = packageJson.dependencies || {};

[vikalp-sajwan]

Hello all, this issue has been fixed, and is not reproducible anymore.
It was fixed a long time back, but we can see the latest code that handles adding scripts to package.json here https://github.com/storybookjs/storybook/blob/next/lib/cli/src/js-package-manager/JsPackageManager.ts#L193,L200

@emileber, the no package.json issue is also not reproducible anymore. I believe, it was fixed in #8205 , more specifically, here, https://github.com/storybookjs/storybook/pull/8205/files#diff-8d17cc91321b260aaa782e8a42cd5634R69

Therefore, I think this issue can be closed.
cc/ @shilman