angular-cli: Ng Serve fails at 95% - TypeError: callbacks[i] is not a function

Versions

Angular CLI: 1.6.8
Node: 9.5.0
OS: darwin x64
Angular: 5.2.4
@angular/cli: 1.6.8
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.8
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0

  MacOS High Sierra 10.13.3

Repro steps

MacBook-Pro:~ daniel$ ng new test-proj … Installed packages for tooling via npm. Successfully initialized git. Project ‘test-proj’ successfully created.

MacBook-Pro:~ daniel$ cd test-proj/

MacBook-Pro:test-proj daniel$ npm install up to date in 6.008s

MacBook-Pro:test-proj daniel$ ng serve

Observed behavior

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 95% emitting/Users/daniel/test-proj/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:40
		callbacks[i](err, result);
		            ^

TypeError: callbacks[i] is not a function
    at Storage.finished (/Users/daniel/test-proj/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:40:15)
    at /Users/daniel/test-proj/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:77:9
    at /Users/daniel/test-proj/node_modules/graceful-fs/polyfills.js:287:18
    at FSReqWrap.oncomplete (fs.js:167:5)

Desired behavior

For build to be 100% successful and served to browser

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 152
  • Comments: 184 (6 by maintainers)

Commits related to this issue

Most upvoted comments

npm install copy-webpack-plugin@4.3.0 solved the problem

Please use reactions for “me too” comments. My inbox would appreciate it, thanks!

Rolling back copy-webpack-plugin to 4.3.0 works.

Hi all,

@evilebottnawi is looking into this from the webpack side, and I am looking at it from the CLI side.

It seems to be a bad interaction in usage of the webpack file system. I don’t yet have more details than that but we are looking into this.

There’s already a couple of suggestions on how to work around for now but I will reiterate for visibility: you can try to force install copy-webpack-plugin@4.3.1 in your project.

Using npm, follow these steps:

  • npm ls copy-webpack-plugin should show copy-webpack-plugin@4.4.0 installed
  • npm install copy-webpack-plugin@4.3.1
  • npm uninstall copy-webpack-plugin@4.3.1 installing and uninstalling should force the npm to resolve and dedupe to 4.3.1
  • npm ls copy-webpack-plugin should show copy-webpack-plugin@4.3.1 installed

I used npm 5.6.0 for this, and recommend you use at least that version as well since it has lockfile support and solves some npm problems with windows.

@kylecordes has also offered some advice for Yarn users in https://github.com/angular/angular-cli/issues/9550#issuecomment-364110779.

I’d like to remind everyone that you only have reproducible installs if you use a lockfile. Both NPM v5+ and Yarn support lockfiles. If your CI works one day but not the next and you did not change your code or package.json, it is likely because one of your dependencies had a bad release and you did not have a lockfile.

It is your responsibility as a library consumer to use lockfiles. No one wants to do a release with bugs but it sometimes happens, and the best we can do is to fix it as fast as possible with a new release. When you have a couple of thousand total dependencies it is only a matter of time until one of them has a bad release.

First time I’m trying Angular. Not a good day lol

This is embarrassing.

Me too

lets go have a drink then come back 😃

thanks @danielszenasi that fix the problem

npm install copy-webpack-plugin@4.3.0

Me too

Me too

npm install copy-webpack-plugin@4.3.0 --save (worked for me)

@skorunka tried the same — didn’t work for me

# ng --version

    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
    
Angular CLI: 1.6.7
Node: 9.3.0
OS: darwin x64
Angular: 5.2.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.7
@angular-devkit/build-optimizer: 0.0.42
@angular-devkit/core: 0.0.29
@angular-devkit/schematics: 0.0.52
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.7
@schematics/angular: 0.1.17
typescript: 2.5.3
webpack: 3.10.0
# ng serve

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 95% emitting/Users/nide/Code/hubs/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:40
		callbacks[i](err, result);
		            ^

TypeError: callbacks[i] is not a function
    at Storage.finished (/Users/nide/Code/hubs/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:40:15)
    at /Users/nide/Code/hubs/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:77:9
    at /Users/nide/Code/hubs/node_modules/graceful-fs/polyfills.js:287:18
    at FSReqWrap.oncomplete (fs.js:167:5)

Running npm install copy-webpack-plugin@4.3.1 worked for me, thank you for the comments!!

“copy-webpack-plugin”: “^4.1.1” is causing the issue. A new version of copy-webpack-plugin (4.4.0) is what broke angular cli.

@MadeRelevant U’r so right… i think this is critical, the Angular team should fix this as fast as possible. Downgrading from 1.6.8 to 1.3.2 is a sad solution even if works.

Same problem. [offtopic] This whole system with 10000 needed packages and semversioning not used properly feels like such a pain in the ass… [/offtopic]

Hi all,

copy-webpack-plugin@4.4.1 was just released with a fix that addresses this problem (https://github.com/webpack-contrib/copy-webpack-plugin/pull/221).

A big thanks to the Webpack folks, especially @evilebottnawi, for looking investigating this problem and releasing a new version so quickly.

Using npm, follow these steps to force update:

  • npm install copy-webpack-plugin@4.4.1
  • npm uninstall copy-webpack-plugin@4.4.1 installing and uninstalling should force the npm to resolve and dedupe to 4.4.1
  • npm ls copy-webpack-plugin should show copy-webpack-plugin@4.4.1 installed

I used npm 5.6.0 for this, and recommend you use at least that version as well since it has lockfile support and solves some npm problems with windows.

@kylecordes has also offered some advice for Yarn users in https://github.com/angular/angular-cli/issues/9550#issuecomment-364110779.

I’d like to remind everyone that you only have reproducible installs if you use a lockfile. Both NPM v5+ and Yarn support lockfiles. If your CI works one day but not the next and you did not change your code or package.json, it is likely because one of your dependencies had a bad release and you did not have a lockfile.

It is your responsibility as a library consumer to use lockfiles. No one wants to do a release with bugs but it sometimes happens, and the best we can do is to fix it as fast as possible with a new release. When you have a couple of thousand total dependencies it is only a matter of time until one of them has a bad release.

I am going to close this topic for now so that my answer will be the most visible for anyone experiencing this issue.

I’m sorry to remove your ability to comment on it but for new users it would be very hard to find the solution with so many comments coming up. I will reopen in a few hours.

For Yarn users, you can override the copy-webpack-plugin version used inside CLI by adding this to your package.json:

  "resolutions": {
    "copy-webpack-plugin": "4.3.0"
  }

The semantics of this are slightly different than just manually overwriting the version once, you’re telling yarn “if anything I am using depends on this package, ignore what version it thinks it wants and give it this one instead”.

npm install copy-webpack-plugin@4.3.0 --save
worked for me

Solved by command : npm install copy-webpack-plugin@4.3.1

Looks like something is superbroken, but i don’t know what to do. I tried to downgrade cli to 1.6.7 but it didn’t work. People is having the same problem even with CLI 1.5, so i think this might be an Angular problem, not only CLI.

Me too. But, could not get it working even with the previous version

I have the same problem.

.../node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:40
		callbacks[i](err, result);
		            ^
TypeError: callbacks[i] is not a function

Versions

@angular/core": “^5.2.4 @angular/cli”: "^1.6.8 Node 9.4.0

Dependencies

“webpack”: “3.10.0”, “enhanced-resolve”: “3.4.1”,

copy-webpack-plugin@4.3.0 didn’t help

This does raise the question of how dependencies are managed in the project. Maybe the use of ^ isn’t the best choice.

I can confim that downgrade of copy-webpack-plugin to 4.3.1 works for me (angular 5.2.3 & 5.2.4 /cli 1.6.6 &1.6.8). Thanks, @neshkatrapati

Show we revert to a previous version?

Now arrived v4.4.1 💃 https://www.npmjs.com/package/copy-webpack-plugin Now it hasn’t this bug!

@angular/cli”: “1.6.1”, angular 5.0.0: solution using copy-webpack-plugin not working for me

We currently investigate problem https://github.com/webpack-contrib/copy-webpack-plugin/issues/217, please don’t spam. Thanks.

its working when i downgrade to 1.3.2

@angular/cli: 1.3.2 node: 9.2.1 os: linux x64 @angular/animations: 5.2.0 @angular/common: 5.2.0 @angular/compiler: 5.2.0 @angular/core: 5.2.0 @angular/forms: 5.2.0 @angular/http: 5.2.0 @angular/platform-browser: 5.2.0 @angular/platform-browser-dynamic: 5.2.0 @angular/router: 5.2.0 @angular/cli: 1.3.2 @angular/compiler-cli: 5.2.0 @angular/language-service: 5.2.0

it seems to work now!

Had the same issue. Resolved by npm install copy-webpack-plugin@4.3.1. angular-cli installed copy-webpack-plugin@4.4.0 which somehow breaks angular-cli.

angular cli: 1.6.8 node: 6.11.5 os: win 10 angular : 4.4.6

Thanks @neshkatrapati

Same here yesterday it worked but today I m also getting same error.

npm install copy-webpack-plugin@4.3.0 --save (worked! ty)

npm install --save copy-webpack-plugin@4.3.1 Worked for us.

We are running Visual Studio Builds for Angular App. This is out setup:

image

For anybody using Gitlab with yarn, you’ll need to add a script line after “yarn install”:

- npm install copy-webpack-plugin@4.3.1

This fixed it for me

Same issue. I tested “npm install copy-webpack-plugin@4.3.1” and it works for me. (localhost project)

Funcionó con la degradacion de webpack…pero en serio…como ha podido llegar a pasar esto? Increible…

npm install copy-webpack-plugin@4.3.1

Is functional for me too. By installing npm 5+ and making package-lock.json on that version solved problem on whole building system. Thanks for that advice.

Had the same issue. Resolved by npm install copy-webpack-plugin@4.3.0.

Root issue is webpack-contrib/copy-webpack-plugin#217

There may be some kind of evil hiding behind the angular’s backend.

This has been solved by a new release of the copy webpack plugin.

npm install copy-webpack-plugin@4.3.1 -save didn’t help in my case

Yeah it is working indeed but i am not sure that this is a good solution anyway… hope it will be fixed soon

Can anyone direct me to a resource that details implementing this fix on an Azure web app through VSTS?

also ng test --code-coverage --single-run doesn’t work anymore

TypeError: Cannot read property 'apply' of undefined

Remove "favicon.ico" from .angular-cli.json in "assets" field solve problem. Investigate more deeply why it is happens

Worked for me, tnx to all! npm install copy-webpack-plugin@4.3.0 --save p.s. I had to put --save to add to package/json Fwi, is this temp solution, or?

npm install copy-webpack-plugin@4.3.0 worked for me

A rollback to ~1.3.0 in your package.json fixes the issue for me as it removes the dependency on copy-webpack-plugin but it’s not exactly something I want to keep long term.

same problem here… we are blocked on so many levels!

https://github.com/angular/angular-cli/blob/8ff95333aee20b946b55ec2f959b41cd4608401d/package.json#L59

Those who use semver are probably big fans of issues described in this thread.

  • Stop using semver!
  • setup greenkeeper or similar software.

so error was in in third party lib “copy-webpack-plugin”: “^4.1.1”, if angular-cli team hard coded dependency like “copy-webpack-plugin”:“4.1.1” this error would not happened in this case authors of code-webpack-plugin would not know so fast that they have error in one release

so maybe npm community need to be less optimistic about semantic versioning and to remove tildes and carets from package json in order to have more robust predicable builds

angular can start first and lets hope that other npm projects will follow

it is not first (last) time this stuff happened it could be even worst that some deeper dependency broke build cure is simple in all packege.json remove tildes and and carets use https://www.npmjs.com/package/npm-check-updates to manually manage project dependencies run ncu - u run npm i run all tests and if it is OK publish

another option is maybe to have in npm option to run it without semantic versioning without tildes and carets so if somebody does not want to test semantic versioning he can do it with for example command npm i --stable where npm could install version without tildes and carets maybe it already exitst but nobody use it or know about it

of course this is not ng cli problem it is general problem with semantic versioning

angular team is doing great job and lets hope that they will attack problem to have more robust builds

svega ovoga nebi bilo da je pera otisao u policiju

@albertnadal a patch isn’t required to fix this issue as it was to do with a dependency which has now fixed, npm install / clearing npm cache then installing should fix the issue

So, I was facing the same problem. What I did

npm uninstall -g @angular/cli
npm cache clean --force
npm install -g @angular/cli

It is working now. Cheers

I have only been able to solve this as well by reverting version of @angular/cli to 1.60 or 1.6.1. I have this issue for more clarity but relates to the topic here: TypeError: fromJSON_1.default is not a function

Leaving issue opened for now to increase visibility, but will close later when reopening comments. For any new users coming into this issue, please check my comment just above regarding the resolution.

works for me!!! --> npm install copy-webpack-plugin@4.3.0 --save

Same problem here with ng build but I have a question about this. Should I add copy-webpack-plugin to my package.json ?

Me too

same here

For me adding “copy-webpack-plugin”: “4.3.1” to package.json solved the problem. Thanks guys

npm install copy-webpack-plugin@4.3.1

worked for me, if executed from project folder.

thanks @danielszenasi

but… the people that have solved the problem: u had installed copy-webpack-plugin before? With this the problem not is solved for me 😦

TypeError: callbacks[i] is not a function 13:35:39 at Storage.finished (/home/jenkins/.jenkins/workspace/ckend_mcdonalds-cms_develop-KUGBU6RPL4XOVDQHQ263X6SXIV33TJD4ZP4ZTNWQABGBLS2LSMLQ/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:40:15) 13:35:39 at /home/jenkins/.jenkins/workspace/ckend_mcdonalds-cms_develop-KUGBU6RPL4XOVDQHQ263X6SXIV33TJD4ZP4ZTNWQABGBLS2LSMLQ/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:77:9 13:35:39 at /home/jenkins/.jenkins/workspace/ckend_mcdonalds-cms_develop-KUGBU6RPL4XOVDQHQ263X6SXIV33TJD4ZP4ZTNWQABGBLS2LSMLQ/node_modules/graceful-fs/polyfills.js:287:18 13:35:39 at FSReqWrap.oncomplete (fs.js:123:15)

I have more or less come to the same conclusion ^ on its own is worse than hell and npm together

No way, it works! copy-webpack-plugin caused it for me to. What I am wondering is how was this figured out that it was that package? Trial and error?

And how is it possible that a non-major upgrade causes this issue? Semversioning is not to be trusted within the javascript world I guess…

Downgrading to 1.3.2 is not an option for me: ERROR in Please update @angular/cli. Angular 5+ requires at least Angular CLI 1.5+

Same!

Linked to #9549

Same issue here

The same here