Angular-cli: Error when running `npm test` after `ng eject`

Created on 1 Aug 2017  Â·  9Comments  Â·  Source: angular/angular-cli

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Versions.

@angular/cli: 1.3.0-rc.2 (e)
node: 6.10.2
os: darwin x64
@angular/common: 4.3.1
@angular/compiler: 4.3.1
@angular/core: 4.3.1
@angular/forms: 4.3.1
@angular/http: 4.3.1
@angular/platform-browser: 4.3.1
@angular/platform-browser-dynamic: 4.3.1
@angular/router: 4.3.1
@angular/cli: 1.3.0-rc.2
@angular/compiler-cli: 4.3.1
@ngtools/webpack: 1.6.0-rc.2

Repro steps.

ng eject
npm install
npm test

The log given by the failure.

ERROR in ./src/test.ts
Module build failed: Error: AotPlugin was detected but it was an instance of the wrong class.
This likely means you have several @ngtools/webpack packages installed. You can check this with `npm ls @ngtools/webpack`, and then remove the extra copies.
    at Object.ngcLoader (/.../node_modules/@ngtools/webpack/src/loader.js:430:19)

Desired functionality.

Mention any other details that might be useful.

The output of npm ls @ngtools/webpack is:

[email protected]
├─┬ @angular/[email protected]
│ └── @ngtools/[email protected]
└── @ngtools/[email protected]

The workaround is to manually delete @angular/cli's copy of @ngtools/webpack (e.g. rm -rf node_modules/@angular/cli/node_modules/@ngtools/webpack), which works because the version it needs is the same as the version my package.json is requesting. This is not a desirable long-term workaround, however.

Another possible workaround is to remove @ngtools/webpack from my package.json, as described here: https://stackoverflow.com/questions/45409582/error-aotplugin-was-detected-but-it-was-an-instance-of-the-wrong-class

However, if this is the intended way to solve the problem, I find it odd that ng eject puts @ngtools/webpack in my devDependencies to begin with.

Most helpful comment

I have this issue on @angular/cli 1.5.5. Tried updating to latest webpack and targeting TS 2.4.2 still getting the Error.

All 9 comments

This is an error on our part. We shouldn't double add it.

I just checked and this doesn't seem to happen anymore. @ngtools/webpack is not in the devDependencies after doing ng eject on a new project. Unsure of where that was fixed, but it seems to be fixed.

I just confirmed that newer versions of the cli do not have this issue.

I think the problem came back. Still have the same issue recently upgraded in a app ejected mode from 1.4.6 to 1.4.7 . Any work around to fix this. Although @ngtools/webpack solved the problem which is not the preferred way as mentioned.

@"dependencies": {
    "@angular/animations": "^4.4.5",
    "@angular/cdk": "^2.0.0-beta.12",
    "@angular/common": "^4.4.5",
    "@angular/compiler": "^4.4.5",
    "@angular/core": "^4.4.5",
    "@angular/forms": "^4.4.5",
    "@angular/http": "^4.4.5",
    "@angular/material": "^2.0.0-beta.12",
    "@angular/platform-browser": "^4.4.5",
    "@angular/platform-browser-dynamic": "^4.4.5",
    "@angular/router": "^4.4.5",
    "core-js": "^2.5.1",
    "hammerjs": "^2.0.8",
    "rxjs": "^5.4.3",
    "zone.js": "^0.8.18"
  },
  "devDependencies": {
    "@angular/cli": "1.4.7",
    "@angular/compiler-cli": "^4.4.5",
    "@angular/language-service": "^4.4.5",
    "autoprefixer": "^6.5.3",
    "circular-dependency-plugin": "^3.0.0",
    "copy-webpack-plugin": "^4.0.1",
    "css-loader": "^0.28.1",
    "cssnano": "^3.10.0",
    "exports-loader": "^0.6.3",
    "file-loader": "^0.10.0",
    "html-webpack-plugin": "^2.29.0",
    "istanbul-instrumenter-loader": "^2.0.0",
    "less-loader": "^4.0.5",
    "postcss-loader": "^1.3.3",
    "postcss-url": "^5.1.2",
    "raw-loader": "^0.5.1",
    "sass-loader": "^6.0.3",
    "source-map-loader": "^0.2.0",
    "style-loader": "^0.13.1",
    "stylus-loader": "^3.0.1",
    "typescript": "~2.5.3",
    "url-loader": "^0.5.7",
    "webpack": "~3.5.5",
    "webpack-concat-plugin": "1.4.0",
    "webpack-dev-server": "~2.7.1"
  }

I have this issue on @angular/cli 1.5.5. Tried updating to latest webpack and targeting TS 2.4.2 still getting the Error.

Any solution to this issue?

Uninstalling cli and installing again worked for me

https://github.com/angular/angular-cli/issues/7127#issuecomment-320930354

this worked for me:
npm audit fix
then ng server without any problem

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings

Related issues

MateenKadwaikar picture MateenKadwaikar  Â·  3Comments

daBishMan picture daBishMan  Â·  3Comments

gotschmarcel picture gotschmarcel  Â·  3Comments

rajjejosefsson picture rajjejosefsson  Â·  3Comments

hareeshav picture hareeshav  Â·  3Comments