react-scripts@1.0.0 can’t `npm start` if dependencies include Storybook #2225

DrewDennison · 2017-05-19T06:22:20Z

If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely.

Can you reproduce the problem with latest npm?

Yes with latest yarn

Many errors, especially related to "missing modules", are due to npm bugs.

If you're using Windows, follow these instructions to update npm.

If you're using OS X or Linux, run this to update npm:

npm install -g npm@latest

cd your_project_directory
rm -rf node_modules
npm install

I did npm upgrade -g yarn (yarn --version gives 0.24.4)
I did rm -rf node_modules
yarn install

Then try to reproduce the issue again.

Can you still reproduce it?
Yes

Description

What are you reporting?
Unable to run yarn start

Expected behavior

App loads on development server

Tell us what you think should happen.

Project was building before upgrading to react-scripts 1.0.0 I was on 0.9.5 before.

Actual behavior

Tell us what actually happens.
Getting this stacktrace

TypeError: Cannot read property 'request' of undefined
  
  - ExternalModuleFactoryPlugin.js:37 handleExternals
    [mustang-web]/[webpack]/lib/ExternalModuleFactoryPlugin.js:37:33
  
  - ExternalModuleFactoryPlugin.js:46 next
    [mustang-web]/[webpack]/lib/ExternalModuleFactoryPlugin.js:46:8
  
  - ExternalModuleFactoryPlugin.js:59 handleExternals
    [mustang-web]/[webpack]/lib/ExternalModuleFactoryPlugin.js:59:7
  
  - ExternalModuleFactoryPlugin.js:79 ExternalModuleFactoryPlugin.<anonymous>
    [mustang-web]/[webpack]/lib/ExternalModuleFactoryPlugin.js:79:5
  
  - NormalModuleFactory.js:246 applyPluginsAsyncWaterfall
    [mustang-web]/[react-scripts]/[webpack]/lib/NormalModuleFactory.js:246:4
  
  - Tapable.js:204 
    [mustang-web]/[react-scripts]/[tapable]/lib/Tapable.js:204:11
  
  - IgnorePlugin.js:56 IgnorePlugin.checkIgnore
    [mustang-web]/[react-scripts]/[webpack]/lib/IgnorePlugin.js:56:10
  
  - Tapable.js:208 NormalModuleFactory.applyPluginsAsyncWaterfall
    [mustang-web]/[react-scripts]/[tapable]/lib/Tapable.js:208:13
  
  - NormalModuleFactory.js:230 NormalModuleFactory.create
    [mustang-web]/[react-scripts]/[webpack]/lib/NormalModuleFactory.js:230:8
  
  - Compilation.js:382 Compilation._addModuleChain
    [mustang-web]/[react-scripts]/[webpack]/lib/Compilation.js:382:17
  
  - Compilation.js:464 Compilation.addEntry
    [mustang-web]/[react-scripts]/[webpack]/lib/Compilation.js:464:8
  
  - SingleEntryPlugin.js:22 SingleEntryPlugin.<anonymous>
    [mustang-web]/[webpack]/lib/SingleEntryPlugin.js:22:15
  
  - Tapable.js:229 Compiler.applyPluginsParallel
    [mustang-web]/[react-scripts]/[tapable]/lib/Tapable.js:229:14
  
  - Compiler.js:488 
    [mustang-web]/[react-scripts]/[webpack]/lib/Compiler.js:488:8
  
  - Tapable.js:131 Compiler.applyPluginsAsyncSeries
    [mustang-web]/[react-scripts]/[tapable]/lib/Tapable.js:131:46
  
  - Compiler.js:481 Compiler.compile
    [mustang-web]/[react-scripts]/[webpack]/lib/Compiler.js:481:7

Environment

Run these commands in the project folder and fill in their results:

npm ls react-scripts (if you haven’t ejected):

npm ls react-scripts                                                                                                                                           [10:58:24 PM]
mustang-web@0.1.0 /Users/drew/projects/mustang/mustang-web
└─┬ react-scripts@1.0.0
  └── UNMET PEER DEPENDENCY webpack@2.5.1

npm ERR! peer dep missing: webpack@2, required by babel-loader@7.0.0
npm ERR! peer dep missing: webpack@^2.2.0, required by extract-text-webpack-plugin@2.1.0
npm ERR! peer dep missing: webpack@^2.2.0, required by webpack-dev-server@2.4.5

node -v:
v7.10.0
npm -v:
4.2.0
yarn -v:
v0.24.4

Then, specify:

Operating system: OSX
Browser and version: Chrome

Reproducible Demo

This is probably something really obvious. Let me know if you would like me to make a public repo. Sorry my code is in a private repo.

Please take the time to create a new app that reproduces the issue.

Alternatively, you could copy your app that experiences the problem and start removing things until you’re left with the minimal reproducible demo.

(Accidentally, you might get to the root of your problem during that process.)

Push to GitHub and paste the link here.

By doing this, you're helping the Create React App contributors a big time!
Demonstrable issues gets fixed faster.

The text was updated successfully, but these errors were encountered:

wirmar · 2017-05-19T09:18:48Z

This might be related to the following yarn issue: yarnpkg/yarn#3315.
I was running into the same issue before downgrading to an older yarn version.

gaearon · 2017-05-19T10:06:36Z

Can you please check if this reproduces if you run npm install rather than Yarn?

phillipj · 2017-05-19T11:37:41Z

I also got invalid webpack version in a repro project just created: #2232 (comment)

Timer · 2017-05-19T12:05:59Z

This is a bug in NPM who is failing to install webpack.
You can switch to yarn or remove other dependencies depending on webpack 1.x.

NPM:

npm WARN extract-text-webpack-plugin@2.1.0 requires a peer of webpack@^2.2.0 but none was installed.
npm WARN webpack-dev-server@2.4.5 requires a peer of webpack@^2.2.0 but none was installed.

create-react-app-v1-upgrade@0.1.0 /Users/joe/Desktop/temp/create-react-app-v1-upgrade
└─┬ @kadira/storybook@2.35.3
  └── webpack@1.15.0

Yarn:

create-react-app-v1-upgrade@0.1.0 /Users/joe/Desktop/temp/create-react-app-v1-upgrade
├─┬ @kadira/storybook@2.35.3
│ ├─┬ babel-loader@6.4.1
│ │ └── webpack@2.5.1  extraneous
│ └── webpack@1.15.0 
└─┬ react-scripts@1.0.0
  └── webpack@2.5.1

gaearon · 2017-05-19T13:45:12Z

So is it npm or Yarn bug?
Shall we close?

phillipj · 2017-05-19T14:03:32Z

Agree with @Timer. Can confirm the dependency graph looks as expected when using yarn, most probably an npm issue since the webpack dependency in CRAs package.json looks good IMO.

Nonetheless something I assume will hit many devs as npm v3 is included in Node.js LTS.

Also verified this is an issue with Node.js v7.10.0 (stable) / npm v4.2.0.

gaearon · 2017-05-19T14:05:23Z

I’m confused that original poster used Yarn. So this is an issue for both?

hoest · 2017-05-19T14:07:18Z

I had the same issue with yarn and npm. When I removed @kadira/storybook everything worked fine. So I think you'll need to wait until @kadira/storybook supports Webpack 2.

gaearon · 2017-05-19T14:08:03Z

It is super weird if npm and Yarn have the same bug. It's kinda hard to believe.

hoest · 2017-05-19T14:09:56Z

When using npm the error was different, but it had the same cause @kadira/storybook.

gaearon · 2017-05-19T14:10:29Z

It might mean that there's a mistake somewhere in dependency tree of some package which is surfacing different messages. I wonder where it is.

hoest · 2017-05-19T14:17:19Z

What can I do to help out? What info do you need?

phillipj · 2017-05-19T14:19:00Z

Yeah, I got so hung up in the dependency graph, I didn't even try to start the server. This is what I observe in my repro project:

yarn

Installation looks to be fine
$ yarn start ends in the output shown by the original poster

npm

Installation warns about missing webpack v2 peer requirement
$ npm start halts a lot quicker:

$ npm start

> create-react-app-v1-upgrade@0.1.0 start /create-react-app-v1-upgrade
> react-scripts start

webpack.validateSchema is not a function

npm ERR! Darwin 15.6.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v6.10.3
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! create-react-app-v1-upgrade@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1

Difference seems to be that yarn at least gets webpack v2 installed, but there's still some issues with the dependencies installed.

gaearon · 2017-05-19T14:24:09Z

Probably the best thing to do would be to create a very isolated test (e.g. a package listing those two as deps) that reproduces the issue, and then file issues both with npm and Yarn.

phillipj · 2017-05-19T14:35:46Z

Sounds like a good idea 👍

@hoest thanks, removing storybook from my test project seemed to fix the issue.

phillipj · 2017-05-19T14:55:42Z

FYI for other storybook users, upgrading to webpack v2 seems to be just around the corner in the upcoming v3 release: https://github.com/storybooks/storybook/pull/1047/files#diff-4ac32a78649ca5bdd8e0ba38b7006a1eR5

DrewDennison · 2017-05-19T15:26:00Z

I can confirm removing storybook fixed the issue for me. Thanks everyone!

gaearon · 2017-05-19T16:16:45Z

I have hidden the Storybook integration from the docs for now: #2252.
And have filed an issue against Storybook: storybookjs/storybook#1073.

I don't think there's anything actionable for us in this issue, but please file bugs with npm and Yarn if you see them not respecting dependency trees.

maximeg · 2017-05-19T22:31:14Z

For those encountering this issue, running yarn upgrade after running yarn add --dev --exact react-scripts@1.0.0 solved the issue without removing storybook.

mindjuice · 2017-05-25T21:25:31Z

@maximeg's fix worked for me, but I was already on a version of react-scripts-ts based on react-scripts@1.0.0, so I only needed to do yarn upgrade.

gaearon added the issue: bug label May 19, 2017

Timer added the tag: underlying tools label May 19, 2017

gaearon changed the title ~~Followed upgrade steps from 0.9.5 to 1.0.0~~ react-scripts@1.0.0 can’t npm start if dependencies include Storybook May 19, 2017

gaearon mentioned this issue May 19, 2017

Support absolute paths with packages/ folder #741

Closed

This was referenced May 19, 2017

Hide React Storybook from the User Guide while it's incompatible #2252

Merged

Compatibility with react-scripts@1.0.1 (Create React App) storybookjs/storybook#1073

Closed

gaearon closed this as completed May 19, 2017

lock bot locked and limited conversation to collaborators Jan 21, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

react-scripts@1.0.0 can’t `npm start` if dependencies include Storybook #2225

react-scripts@1.0.0 can’t `npm start` if dependencies include Storybook #2225

DrewDennison commented May 19, 2017

wirmar commented May 19, 2017

gaearon commented May 19, 2017

phillipj commented May 19, 2017

Timer commented May 19, 2017

gaearon commented May 19, 2017

phillipj commented May 19, 2017

gaearon commented May 19, 2017

hoest commented May 19, 2017

gaearon commented May 19, 2017

hoest commented May 19, 2017

gaearon commented May 19, 2017

hoest commented May 19, 2017

phillipj commented May 19, 2017

gaearon commented May 19, 2017

phillipj commented May 19, 2017

phillipj commented May 19, 2017 •

edited

DrewDennison commented May 19, 2017

gaearon commented May 19, 2017

maximeg commented May 19, 2017

mindjuice commented May 25, 2017

react-scripts@1.0.0 can’t npm start if dependencies include Storybook #2225

react-scripts@1.0.0 can’t npm start if dependencies include Storybook #2225

Comments

DrewDennison commented May 19, 2017

Can you reproduce the problem with latest npm?

Description

Expected behavior

Actual behavior

Environment

Reproducible Demo

wirmar commented May 19, 2017

gaearon commented May 19, 2017

phillipj commented May 19, 2017

Timer commented May 19, 2017

gaearon commented May 19, 2017

phillipj commented May 19, 2017

gaearon commented May 19, 2017

hoest commented May 19, 2017

gaearon commented May 19, 2017

hoest commented May 19, 2017

gaearon commented May 19, 2017

hoest commented May 19, 2017

phillipj commented May 19, 2017

yarn

npm

gaearon commented May 19, 2017

phillipj commented May 19, 2017

phillipj commented May 19, 2017 • edited

DrewDennison commented May 19, 2017

gaearon commented May 19, 2017

maximeg commented May 19, 2017

mindjuice commented May 25, 2017

react-scripts@1.0.0 can’t `npm start` if dependencies include Storybook #2225

react-scripts@1.0.0 can’t `npm start` if dependencies include Storybook #2225

phillipj commented May 19, 2017 •

edited