Angular-cli: Error: ngCompiler.ReflectorHost is not a constructor

Created on 23 Nov 2016  Â·  47Comments  Â·  Source: angular/angular-cli

Please provide us with the following information:

OS?

Mac OSX (Sierra)

Versions.

ngtools/webpack - 1.1.7

Repro steps.

git clone github.com/prsolucoes/angular2-starter-project
cd angular2-starter-project
npm install
npm start

The log given by the failure.

paulo@MacBook-Pro-de-Paulo:~/Developer/workspaces/node/angular2-starter-project (master) $ npm start

> [email protected] start /Users/paulo/Developer/workspaces/node/angular2-starter-project
> npm run ngc && concurrently -r "webpack-dev-server --config webpack.config.js" "node ./bin/ngc-watch.js"


> [email protected] ngc /Users/paulo/Developer/workspaces/node/angular2-starter-project
> ngc -p ./tsconfig.json

/Users/paulo/Developer/workspaces/node/angular2-starter-project/node_modules/@ngtools/webpack/src/plugin.js:127
        this._reflectorHost = new ngCompiler.ReflectorHost(this._program, this._compilerHost, this._angularCompilerOptions);
                              ^

TypeError: ngCompiler.ReflectorHost is not a constructor
    at AotPlugin._setupOptions (/Users/paulo/Developer/workspaces/node/angular2-starter-project/node_modules/@ngtools/webpack/src/plugin.js:127:31)
    at new AotPlugin (/Users/paulo/Developer/workspaces/node/angular2-starter-project/node_modules/@ngtools/webpack/src/plugin.js:35:14)
    at Object.<anonymous> (/Users/paulo/Developer/workspaces/node/angular2-starter-project/webpack/plugins.js:12:2)
    at Module._compile (module.js:556:32)
    at Object.Module._extensions..js (module.js:565:10)
    at Module.load (module.js:473:32)
    at tryModuleLoad (module.js:432:12)
    at Function.Module._load (module.js:424:3)
    at Module.require (module.js:483:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/paulo/Developer/workspaces/node/angular2-starter-project/webpack.config.js:15:11)
    at Module._compile (module.js:556:32)
    at Object.Module._extensions..js (module.js:565:10)
    at Module.load (module.js:473:32)
    at tryModuleLoad (module.js:432:12)
    at Function.Module._load (module.js:424:3)

Mention any other details that might be useful.

My repository with the current problem:
https://github.com/prsolucoes/angular2-starter-project

My plugin initialization:

let ngtools = require('@ngtools/webpack');
module.exports = [
    new ngtools.AotPlugin({
        tsConfigPath: './tsconfig.json',
        baseDir: path.join(process.cwd(), 'src'),
        entryModule: path.join(process.cwd(), 'src', 'app', 'modules', 'app.module') + '#AppModule'
    }),
....
picture prsolucoes
👍10

Most helpful comment

I'm also seeing this issue with angular-cli 1.0.0-beta.22-1 + angular 2.3.0.

picture colemickens on 8 Dec 2016
👍30

All 47 comments

I think this is due to the angular 2.2.2 moving ReflectorHost to @angular/language-service.

As a temporary workaround, I've locked my versions to 2.2.1 for @angular/*, 3.2.1 for @angular/router, 2.0.10 for typescript and everything seems to be building fine with AoT.

jessezhang91 picture jessezhang91 on 23 Nov 2016
👍4

I think you are correct. Because with version 2.2.1 everything is working fine :(

prsolucoes picture prsolucoes on 23 Nov 2016

Intermediately fixed by https://github.com/angular/angular-cli/pull/3242, updating to angular-cli to "1.0.0-beta.21" as described here fixes aot compilation for now.

MartinNowak picture MartinNowak on 23 Nov 2016

Thanks. But i dont use angular-cli. I have backed all angular2 deps to 2.2.1 version until it be solved.

prsolucoes picture prsolucoes on 23 Nov 2016

@prsolucoes Yes, we also updated the peer dependency of the webpack plugin. This will be resolved properly in the future (next week, because this week is thanksgiving). In the meantime you have to use Angular v2.2.1. This is unfortunate and we're looking at long term solutions to prevent this in the future.

hansl picture hansl on 23 Nov 2016

I'm not sure why HanZ closed this. Everything was working perfect for me with angular-cli-b21, this morning i update angular-cli-b22, tried to build, and i was looking at the error in my console. Same error mentioned above. I'm certain this has something to do with minor project configuration impedance, and you might like to call it a bug, no bug has ever stopped me before, so why would this one stop me now? And, no, I'm not rolling back any of dependencies, i keep everything on the bleeding edge.

digimax picture digimax on 3 Dec 2016
👍1

I'm also seeing this issue with angular-cli 1.0.0-beta.22-1 + angular 2.3.0.

colemickens picture colemickens on 8 Dec 2016
👍30

Same here with angular 2.3.0. Please re-open.

alvipeo picture alvipeo on 8 Dec 2016
👍12

Also same problem.

Angular: 2.3.0
CLI: 1.0.0-beta.22-1

stanislavromanov picture stanislavromanov on 8 Dec 2016
👍17

Same with my project too!

Angular: 2.3.0
CLI: 1.0.0-beta.22-1

petercn picture petercn on 8 Dec 2016
👍7

@hansl any news on this

PG2000 picture PG2000 on 8 Dec 2016

For those subscribed to this issue, there's a bit more detail on another issue: https://github.com/angular/angular-cli/issues/3467#issuecomment-265814703

colemickens picture colemickens on 8 Dec 2016
👍1

Angular: 2.3.0 (also tried with 2.2.3)
CLI: 1.0.0-beta.22-1 (tried with 22 also)

Same here, I don't think as correct @colemickens said in the other issue that is productive to close the issues when they are still actually issues, because people cannot track internal "tickets" of the team @hansl.

Please re-open or update the subscribers for the process.
In our team whoever did an npm install simply cannot work, even if he downgrades.

vapits picture vapits on 9 Dec 2016

Same issue here..
I can't run my project and getting
ngCompiler.ReflectorHost is not a constructor

Using angular-cli": "1.0.0-beta.22-1 and angular 2.3.0

ritox842 picture ritox842 on 9 Dec 2016

Same here with @ngtools/[email protected]

unsafecode picture unsafecode on 11 Dec 2016

I ran into this problem after updating angular-cli from beta.20-4 tobeta.22-1. After running ng init and diffing package.json, I noticed that I had "@angular/compiler-cli" : "^2.2.4" in the dependencies object, and "@angular/compiler-cli" : "2.2.3" in the devDependencies object. I removed the entry from dependencies, and was able to run npm start.

kevinsherman picture kevinsherman on 11 Dec 2016

@kevinsherman what version of angular are you using?

Nosfistis picture Nosfistis on 11 Dec 2016

@Miced

"dependencies": { "@angular/common": "2.2.3", "@angular/compiler": "2.2.3", "@angular/core": "2.2.3", "@angular/forms": "2.2.3", "@angular/http": "2.2.3", "@angular/platform-browser": "2.2.3", "@angular/platform-browser-dynamic": "2.2.3", "@angular/router": "3.2.3", "@types/node": "^6.0.51", "bootstrap": "^3.3.7", "core-js": "^2.4.1", "font-awesome": "^4.7.0", "ng2-bootstrap": "^1.1.16", "rxjs": "5.0.0-beta.12", "ts-helpers": "^1.1.1", "zone.js": "^0.6.23" }

kevinsherman picture kevinsherman on 11 Dec 2016

Seeing the same problem as above with both 2.2.4 and 2.2.3.

zakdances picture zakdances on 12 Dec 2016

I was able to get the angular 2.3.0 working downgrading the angular-cli from version [email protected] to version [email protected]. Now the error has gone.

reginaldocmrg picture reginaldocmrg on 12 Dec 2016
👍4

@reginaldocmrg WOW that worked!

sclausen picture sclausen on 12 Dec 2016
👍1

How do you actually rollback, though? I performed a global install of [email protected], after global removing 22, and still have .beta22! I feel liked I'm negotiating with a cartoon.

Adrriver picture Adrriver on 12 Dec 2016

I installed [email protected] locally.

reginaldocmrg picture reginaldocmrg on 12 Dec 2016
👍1

@Adrriver it worked well for me
``` sh
sudo npm uninstall -g angular-cli
sudo npm install -g [email protected]

sclausen picture sclausen on 12 Dec 2016
👍1

@Adrriver solution works for me also...

ritox842 picture ritox842 on 13 Dec 2016

I'm getting the same error but I'm not using angular-cli. I'm using webpack. My package.json looks like this
{
"version": "1.0.0",
"name": "sample",
"private": true,
"dependencies": {
"@angular/common": "~2.3.0",
"@angular/compiler": "~2.3.0",
"@angular/core": "~2.3.0",
"@angular/forms": "~2.3.0",
"@angular/http": "~2.3.0",
"@angular/platform-browser": "~2.3.0",
"@angular/platform-browser-dynamic": "~2.3.0",
"@angular/router": "~3.3.0",
"angular-in-memory-web-api": "~0.1.17",
"core-js": "^2.4.1",
"ionic-angular": "^2.0.0-rc.3",
"jquery": "^3.1.1",
"reflect-metadata": "^0.1.8",
"rxjs": "5.0.0-rc.4",
"systemjs": "0.19.40",
"typescript": "^2.1.4",
"zone.js": "^0.7.2"
},
"devDependencies": {
"@angular/compiler-cli": "^2.3.0",
"@ngtools/webpack": "^1.1.9",
"@types/jquery": "^2.0.34",
"angular2-template-loader": "0.6.0",
"html-webpack-plugin": "^2.24.1",
"raw-loader": "^0.5.1",
"ts-loader": "1.3.1",
"webpack": "2.1.0-beta.27"
}
}

mahindar5 picture mahindar5 on 13 Dec 2016

@mahindar5 Error actually comes from webpack, either you use ng cli or not.

stanislavromanov picture stanislavromanov on 13 Dec 2016

Hi @stanislavromanov is there any workaround to fix this? Thanks

mahindar5 picture mahindar5 on 13 Dec 2016

Tried all suggested solutions still nothing working.
@angular2.3
@ngtools/webpack 1.1.9

daviddsingleton picture daviddsingleton on 13 Dec 2016
👍2

@daviddsingleton you need angular 2.2.4 (and 3.2.4 for router)

jessezhang91 picture jessezhang91 on 13 Dec 2016

Same issue here with 1.0.0-beta.23, as in (#3501, #3467 and #3367). Besides the problem building, I do not know why __UNMET PEER DEPENDENCY__ message when installing latest CLI release.

ng --version

angular-cli: 1.0.0-beta.23
node: 6.9.2
os: win32 x64

npm ls --depth=0

+-- UNMET PEER DEPENDENCY @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- UNMET PEER DEPENDENCY @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- UNMET PEER DEPENDENCY @angular/[email protected]
+-- @angular/[email protected]
+-- @angular/[email protected]
+-- @types/[email protected]
+-- @types/[email protected]
+-- @types/[email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- UNMET PEER DEPENDENCY [email protected]
+-- [email protected]
+-- [email protected]
+-- UNMET PEER DEPENDENCY [email protected]
+-- [email protected]
`-- [email protected]

npm ERR! peer dep missing: @angular/[email protected], required by @angular/[email protected]
npm ERR! peer dep missing: @angular/[email protected], required by @angular/[email protected]
npm ERR! peer dep missing: @angular/[email protected], required by @angular/[email protected]
npm ERR! peer dep missing: [email protected], required by @angular/[email protected]
npm ERR! peer dep missing: [email protected], required by [email protected]
npm ERR! peer dep missing: tslint@~4.0.0, required by [email protected]
npm ERR! peer dep missing: @angular/[email protected], required by @ngtools/[email protected]
npm ERR! peer dep missing: @angular/[email protected], required by @ngtools/[email protected]
npm ERR! peer dep missing: tslint@^3.0.0, required by [email protected]

ng serve

ngCompiler.ReflectorHost is not a constructor
TypeError: ngCompiler.ReflectorHost is not a constructor
     at AotPlugin._setupOptions (.\node_modules\@ngtools\webpack\src\plugin.js:136:31)
     at new AotPlugin (.\node_modules\@ngtools\webpack\src\plugin.js:37:14)
     at Object.exports.getWebpackAotConfigPartial (.\node_modules\angular-cli\models\webpack-build-typescript.js:44:13)
     at new NgCliWebpackConfig (.\node_modules\angular-cli\models\webpack-config.js:25:42)
     at Class.run (.\node_modules\angular-cli\tasks\serve-webpack.js:20:22)
     at .\node_modules\angular-cli\commands\serve.js:108:26
     at process._tickCallback (internal/process/next_tick.js:103:7)
alorle picture alorle on 16 Dec 2016
👍1

Has progress?i has same issuse,i used webpack(2.1.0-beta.25) @angular(2.2.3) @ngtools/webpack(1.1.9)

keyiis picture keyiis on 20 Dec 2016
👍1

had the same problem with beta 24, try creating a new project , then copy your source folder to that new project. then modify config files as required. It worked for me.

soccio picture soccio on 21 Dec 2016
👍3

I had the same issue; all that was required to fix it was to remove node_modules and run npm install.

If you're using yarn you need to remove both node_modules and yarn.lock and run yarn afterwards. I suspect a dependency of a dependency is fixed in a newer version and you just need to update it.

mgol picture mgol on 22 Dec 2016
👍6

@mgol Thanks a lot, the problem was with yarn. I removed the yarn.lock and it's now working !

maxime1992 picture maxime1992 on 23 Dec 2016

getting same error with angular 2.4.1 . Any specific details on which version of angular AOT works ?

arunswaminathank picture arunswaminathank on 4 Jan 2017

@arunswaminathank Have you tried removing node_modules (and yarn.lock if you use yarn) and reinstalling dependencies?

mgol picture mgol on 4 Jan 2017

Yes, I tried , still the same error

On 04-Jan-2017 5:04 PM, "Michał Gołębiowski" notifications@github.com
wrote:

@arunswaminathank https://github.com/arunswaminathank Have you tried
removing node_modules (and yarn.lock if you use yarn) and reinstalling
dependencies?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/3241#issuecomment-270351603,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ATftz-WUvXjQHyMBgMi-cPNyvpWl3NUtks5rO4OqgaJpZM4K6EUT
.

arunswaminathank picture arunswaminathank on 4 Jan 2017

This is unreal. I can't build my project about 2 weeks. Every combination of versions gives different errors.

ichent picture ichent on 6 Jan 2017
👍1

I'm using AOT with beta.24 and the below versions. 

  "dependencies": {
    "@angular/common": "^2.4.0",
    "@angular/compiler": "^2.4.0",
    "@angular/core": "^2.4.0",
    "@angular/forms": "^2.4.0",
    "@angular/http": "^2.4.0",
    "@angular/platform-browser": "^2.4.0",
    "@angular/platform-browser-dynamic": "^2.4.0",
    "@angular/router": "^3.4.0",
    "core-js": "^2.4.1",
    "rxjs": "^5.0.1",
    "ts-helpers": "^1.1.1",
    "zone.js": "0.7.2"
  },
  "devDependencies": {
    "@angular/compiler-cli": "^2.4.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "^6.0.42",
    "angular-cli": "1.0.0-beta.24",
    "codelyzer": "~2.0.0-beta.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-remap-istanbul": "^0.2.1",
    "protractor": "~4.0.13",
    "ts-node": "1.2.1",
    "tslint": "^4.0.2",
    "typescript": "~2.0.3"
  }
zackarychapple picture zackarychapple on 6 Jan 2017

Let me try that today too. I put my prj on hold because of these issues like 3 weeks ago. Let's hope it'll work...

alvipeo picture alvipeo on 6 Jan 2017

Still does not work. This is ridiculous.

stanislavromanov picture stanislavromanov on 12 Jan 2017
😕4

Was there a fix for this? I am experience this as well :(

bliitzkrieg picture bliitzkrieg on 31 Jan 2017

That's fixed pretty long time ago. My suggestion is to create a new project with beta.26 (the current version as I write this).

alvipeo picture alvipeo on 31 Jan 2017

I update all package to last version,the issuse fixed.

keyiis picture keyiis on 31 Jan 2017

I use this package.json and fixed!
"dependencies": {
"@angular/common": "4.0.0",
"@angular/compiler": "4.0.0",
"@angular/compiler-cli": "4.0.0",
"@angular/core": "4.0.0",
"@angular/forms": "4.0.0",
"@angular/http": "4.0.0",
"@angular/platform-browser": "4.0.0",
"@angular/platform-browser-dynamic": "4.0.0",
"@ionic-native/core": "3.4.2",
"@ionic-native/splash-screen": "3.4.2",
"@ionic-native/status-bar": "3.4.2",
"@ionic/storage": "2.0.1",
"ionic-angular": "3.0.1",
"ionicons": "3.0.0",
"rxjs": "5.1.1",
"sw-toolbox": "3.4.0",
"zone.js": "^0.8.4",
"@ionic-native/background-mode": "^3.4.4",
"@ionic-native/geolocation": "^3.4.4",
"@types/google-maps": "^3.2.0",
"angularfire2": "^2.0.0-beta.7",
"firebase": "^3.6.9",
"geofire": "^4.1.2"
},
"devDependencies": {
"@ionic/app-scripts": "1.3.0",
"typescript": "~2.2.1"
}

naujfract picture naujfract on 11 Apr 2017

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._

angular-automatic-lock-bot[bot] picture angular-automatic-lock-bot[bot] on 7 Sep 2019
Was this page helpful?
0 / 5 - 0 ratings

Related issues

daBishMan picture daBishMan  Â·  3Comments
5amfung picture 5amfung  Â·  3Comments
ericel picture ericel  Â·  3Comments
jmurphzyo picture jmurphzyo  Â·  3Comments
hartjo picture hartjo  Â·  3Comments