Angular-cli: ERROR in AppModule is not an NgModule

[tHesTx]

Please provide us with the following information:

OS?

Windows 7

Versions.

ng --version
@angular/cli: 1.0.0-beta.31
node: 7.2.0
os: win32 x64
@angular/common: 2.4.7
@angular/compiler: 2.4.7
@angular/core: 2.4.7
@angular/forms: 2.4.7
@angular/http: 2.4.7
@angular/platform-browser: 2.4.7
@angular/platform-browser-dynamic: 2.4.7
@angular/router: 3.4.7
@angular/cli: 1.0.0-beta.31
@angular/compiler-cli: 2.4.7
@ngtools/webpack: 1.2.9

$ npm list -g --depth=0
C:\Users\Macpro\AppData\Roaming\npm
+-- @angular/[email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
+-- [email protected]
`-- [email protected]

Repro steps.

I've tried to update the angular-cli with these steps: https://github.com/angular/angular-cli#updating-angular-cli

I've done global update and local project as well, all good until I try to serve the app - it gives me the below error

The log given by the failure.

$ ng serve

ERROR in AppModule is not an NgModule
ERROR in ./src/main.ts
Module build failed: TypeError: Cannot read property 'newLine' of undefined
at Object.getNewLineCharacter (C:\Users\Macpro\Desktop\Test\Angular2\Angular2\CLI\puzzleTest\node_modules\typescript\lib\typescript.js:8062:20)
at Object.createCompilerHost (C:\Users\Macpro\Desktop\Test\Angular2\Angular2\CLI\puzzleTest\node_modules\typescript\lib\typescript.js:44978:26)
at Object.ngcLoader (C:\Users\Macpro\Desktop\Test\Angular2\Angular2\CLI\puzzleTest\node_modules\@ngtools\webpacksrc\loader.js:341:33)
@ multi webpack-dev-server/client?http://localhost:4200/ ./src/main.ts
webpack: Failed to compile.

---

I also got this "minimatch" errror every time I try to update or install somtehing:
npm update -g

npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue

But as you can see above I have "[email protected]" - anyway this is not the problem here

Mention any other details that might be useful.

I've tried to update the typescript like I've seen on the web but with no success. I also

---

Thank you for your time!

[SanderElias]

I got the same problem. On ubuntu 16. But only on the first build:

The only change I made was adding an empty line to the app.module.ts

[dessalines]

Don't ask me why, but I think this is a yarn issue. Running

rm -rf node_modules
npm i
ng serve

fixes the problem, but the problem remains if you do yarn instead of npm i.

EDIT: another thing that worked was reinstalling yarn : https://yarnpkg.com/lang/en/docs/install/#linux-tab

[pinalbhatt]

Thanks @dessalines
Not sure whats issue with yarn but your instructions worked.

[SanderElias]

Ok, I reinstalled yarn using my package manager, removed the node_moduls. used yarn to install.
Problem stays the same.
removed node_modules yet again, and used npm to install, the problem goes away. Even if you use yarn after that.

conclusion. This problem happens and is reproducible if you use yarn to install your packages. (which is a shame, as yarn is at least 2 times faster in my situation.)

reason (an educated guess!): As yarn is more strict on installing, it probably forces a slightly older dependency in the tree somewhere.

[djedje72]

This problem seems to occur with Typescript 2.1.6.

If you clean your node modules, change Typescript to [email protected] and do a yarn install or npm install, the problem should be resolved.

[tHesTx]

So, for me, should I install this yarn? I do not use it

[SanderElias]

@tHesTx, no, just use npm install instead. For me, the problem occurs when I use yarn instead. It is solved if I use npm. Also, in my case it was just on the first run, after that it worked ok.

[djedje72]

@SanderElias Yes it was just on the first run for ng serve but can you do ng build?
@tHesTx i think you can do npm install if you don't use yarn

[tHesTx]

I don't know what to do anymore, nothing works. DO I have to update something in package.json or angular-cli.json in my project ? Building gives the same error

[djedje72]

@tHesTx For me, i'd to change
"typescript": "2.1.6"
to
"typescript":"2.1.5"
in my package.json file because i use local typescript version.

If you use global version, you can try:
npm uninstall -g typescript
then
npm install -g [email protected]

[tHesTx]

@djedje72 I've done that, currently is set to "typescript": "2.1.5". Before to do the first angular-cli update which got me to this point it was like this: "typescript": "~2.0.3". Uninstall and reinstall too. I've also updated the "@angular/cli": "1.0.0-beta.24", "angular-cli": "1.0.0-beta.24", from "devDependencies" to 31, in angular-cli.json: "version": "1.0.0-beta.24", -> to 31 as well.
PS: If I do these changes before npm install, when I run npm install gives me some errors about the CLI version, somthing like the requested(beta.31) version not exists

[tHesTx]

Ok, I've generated a new app with angular-cli which works, but in package.json it uses this: "typescript": "~2.0.0" - but I have installed 2.1.5 globally. Why is that?

[aviramga]

Your local Typescript version doesn't necessarily have to match your global. CLI generates a package.json with default dependencies it requires, but you can (and should) updated them according to your needs.

I actually had an issue trying to run angular-2.4.7 with typescript 2.0.0 but after updating my project's package.json with typescript 2.1.6 the issue was resolved.
I assume if you do the same it will resolve your issue as well.

goodnessSquad

[SanderElias]

Just did an update today, to latest cli and Angular 4.
this is still happening:

Only on the first compile, afterwards it works.

NOTE, this only happens if you installed the project with YARN, not with NPM install

[hansl]

This is a disconnect between Angular 4 and 2.4 that happens in some cases. You probably have an @angular/core version in the CLI node_modules that is different than your application's node_modules.

Try with the RC.0, we did fix a few of those mismatch. Also, try to clear your node_modules and reinstall.

[SanderElias]

@hansl I can confirm the problem is now gone. Even with a yarn installed project!

[frenkan]

I had similar issue with yarn. My problem was resolved by deleting the yarn.lock file and re-running the yarn command.

[Marcidius]

FYI, a fix for me was to downgrade to typescript "2.0.2" while keeping cli version at "1.0.0-rc.2".

[rajinder-yadav]

I am seeing this error when I install using yarn after upgrading to "@angular/cli": "^1.0.0-rc.4".

I don't not see this problem if I do npm install, only when I install using yarn.

Also I have deleted node_modules folder and my yarn.lock file.

Here is my package.json file.

{
  "name": "routes",
  "version": "0.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "lint": "tslint \"src/**/*.ts\"",
    "test": "ng test",
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "protractor"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "^2.4.10",
    "@angular/compiler": "^2.4.10",
    "@angular/core": "^2.4.10",
    "@angular/forms": "^2.4.10",
    "@angular/http": "^2.4.10",
    "@angular/platform-browser": "^2.4.10",
    "@angular/platform-browser-dynamic": "^2.4.10",
    "@angular/router": "^3.4.10",
    "@types/node": "^6.0.65",
    "codelyzer": "^2.0.1",
    "core-js": "^2.4.1",
    "rxjs": "^5.2.0",
    "ts-helpers": "^1.1.2",
    "tslint": "^4.5.1",
    "zone.js": "^0.7.8"
  },
  "devDependencies": {
    "@angular/cli": "^1.0.0-rc.4",
    "@angular/compiler-cli": "^2.4.10",
    "@types/jasmine": "^2.5.46",
    "@types/node": "^6.0.65",
    "codelyzer": "^2.0.1",
    "jasmine-core": "^2.5.2",
    "jasmine-spec-reporter": "^2.7.0",
    "karma": "^1.5.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.1.0",
    "karma-remap-istanbul": "^0.2.2",
    "protractor": "^4.0.14",
    "tachyons": "^4.6.2",
    "ts-node": "^1.7.3",
    "tslint": "^4.5.1",
    "typescript": "^2.2.1"
  }
}

[Arnaud73]

Same thing here. I upgraded easily from beta.28 to rc.0, then rc.1 and rc.2. However, I face the same problem when upgrading to rc.4. I had to revert to rc.2 for my app to build again.

Here is my package.json:
{ "name": "my-app", "version": "0.0.1", "license": "UNLICENSED", "angular-cli": {}, "scripts": { "ng": "ng", "hmr": "ng serve --hmr -e=hmr", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "pree2e": "webdriver-manager update --standalone false --gecko false", "e2e": "protractor" }, "private": true, "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/material": "2.0.0-beta.2", "@angular/platform-browser": "^2.4.0", "@angular/platform-browser-dynamic": "^2.4.0", "@angular/router": "^3.4.7", "@angularclass/hmr": "^1.2.2", "@covalent/core": "^1.0.0-beta.2-1", "@ngrx/core": "^1.2.0", "@ngrx/effects": "^2.0.1", "@ngrx/store": "^2.2.1", "@ngrx/store-devtools": "^3.2.3", "@ngx-translate/core": "^6.0.0", "@ngx-translate/http-loader": "^0.0.3", "angular2-jwt": "^0.1.28", "angular2-moment": "^1.3.3", "core-js": "^2.4.1", "hammerjs": "^2.0.8", "karma-phantomjs-launcher": "^1.0.2", "lodash": "^4.17.4", "merge-options": "0.0.64", "phantomjs-prebuilt": "^2.1.14", "rxjs": "^5.1.0", "ts-helpers": "^1.1.1", "zone.js": "^0.7.6" }, "devDependencies": { "@angular/cli": "1.0.0-rc.2", "@angular/compiler-cli": "^2.4.0", "@types/jasmine": "^2.5.46", "@types/lodash": "^4.14.57", "@types/node": "^7.0.10", "codelyzer": "~2.0.0", "jasmine-core": "2.5.2", "karma": "1.4.1", "karma-chrome-launcher": "^2.0.0", "karma-cli": "^1.0.1", "karma-coverage-istanbul-reporter": "^0.2.0", "karma-jasmine": "^1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.0", "ts-node": "2.0.0", "tslint": "^4.4.2", "typescript": "~2.2.1" } }

[b-johnse]

I also had to revert back to rc2 from rc4 in order to have my ng serve work again. As previously mentioned, works with npm install but not with yarn

[dessalines]

Downgrading typescript to 2.0.2 and keeping 1.0.0-rc.2 is what worked for me.

[taye]

In my case, the problem was that @angular/cli and it's related tools didn't believe in using export default to export anything so trying to import submodules with import name from './module' syntax just imported undefined instead. Avoiding default exports solved this issue for me.

[Arnaud73]

I tested upgrading to @angular/cli 1.0.0and it seamed to work, except I'm using angular material and Covalent, both of them not yet compatible with Angular 4.

[lilingling3]

{
"name": "admin2",
"version": "0.0.0",
"license": "MIT",
"angular-cli": {},
"scripts": {
"ng": "ng",
"start": "ng serve",
"test": "ng test",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor"
},
"private": true,
"dependencies": {
"@angular/animations": "~4.0.0",
"@angular/common": "~2.3.1",
"@angular/compiler": "~2.4.1",
"@angular/core": "~2.3.1",
"@angular/forms": "~2.3.1",
"@angular/http": "~2.3.1",
"@angular/platform-browser": "~2.3.1",
"@angular/platform-browser-dynamic": "~2.3.1",
"@angular/router": "~3.3.1",
"angular-eonasdan-datetimepicker": "~0.3.9",
"angular-in-memory-web-api": "~0.3.1",
"bootstrap": "~3.3.7",
"bootstrap-datepicker": "~1.6.4",
"chart.js": "~2.5.0",
"core-js": "~2.4.1",
"datatables.net": "~1.10.13",
"datatables.net-dt": "~1.10.13",
"echarts": "~3.4.0",
"eonasdan-bootstrap-datetimepicker": "~4.17.47",
"jquery": "~3.1.1",
"jquery-ui-dist": "~1.12.1",
"moment": "~2.18.1",
"ng2-bootstrap": "~1.6.3",
"ng2-charts": "~1.5.0",
"ng2-toastr": "~1.6.0",
"ng2-translate": "5.0.0",
"portfinder": "1.0.9",
"rxjs": "~5.0.0",
"tether": "~1.4.0",
"tinymce": "4.5.3",
"ts-helpers": "~1.1.1",
"zone.js": "~0.7.2",
"ztree": "3.5.24"
},
"devDependencies": {
"@angular/cli": "^1.0.3",
"@angular/compiler-cli": "2.4.1",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.42",
"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.3.0",
"typescript": "2.0.10"
}
}
I have the same question,what can I do?

[SanderElias]

@lilingling3 Make sure you update all your dependencies to the same version. I see:

"@angular/animations": "~4.0.0",
"@angular/common": "~2.3.1",
"@angular/compiler": "~2.4.1",

3 different angular versions! If you are updating your project, make sure you have the same version on all @angular stuff for use. I would recommend the last stable version (currently 4.1.2).
Fix the package.json. delete node_modules and run npm install again. (or the yarn version of that)

[lilingling3]

Before I used angular-cli ，I use angular/cli now.

[cport1]

I can also produce this error only when using yarn instead of npm install

[pumano]

@cport1 same for me.

[kleber-swf]

I have this problem after a npm update with typescript 2.3.2. I don't know if it's related but the first time I forgot to stop the project before I executed the command and it give me an error about not being able to delete some files. I had to delete the entire node_module folder and execute a npm install to fix it.

[zhou3q]

I also get this error.Watch tips below.

I change pachage.json typescript to 2.2.2,then delete node_modules, re npm install,and ng serve.Wo pass.

[sjswoboda]

Still happening for us with npm. Using angular version 4.2.6 and angular material with typescript 2.2.3 (also tried 2.3 and 2.4).

[IsNull]

@sjswoboda Did you find anything to resolve the issue? This is haunting us for the past week and wasting away our time. Using Typescript 2.1.5 is not an option as Angular Material is not working with it, and newer versions all end up with _xy is not an NgModule_

[sjswoboda]

@IsNull -- we've been through _so many errors_ in the past few weeks, so I cannot remember what fixes what. Based on our change logs, the issue appears to be:

• Ensuring that all angular projects are on the same version. No more ^4.2.6 or ~4.2.6. We just put in the exact version:

"@angular/animations": "4.2.6",
"@angular/common": "4.2.6",
"@angular/compiler": "4.2.6",
"@angular/compiler-cli": "4.2.6",
"@angular/core": "4.2.6",
"@angular/forms": "4.2.6",
"@angular/http": "4.2.6",

We have since upgraded to 4.3.4 and that is working fine for us. We are using TypeScript 2.4.1 and angular/cli is 1.2.1. So far, we haven't seen these errors again (don't worry, once you resolve these, you'll just get different problems).

I am sorry I can't be of more help.

[IsNull]

@sjswoboda Thank you for your support. We have startet tackling the issue (or issues) down and make it reproducible #7384.
What I know for sure is that subsets of the now problematic libraries have worked in the same environment. Which is a clear indication that a very nasty error is at the core of all this - some constellation of configuration, dependencies or actual code in use will trigger it.

(don't worry, once you resolve these, you'll just get different problems)

There are so many layers, configurations and involved tools, and the error messages are not really helping. Im still amazed how complicated this all turned out. 😅

[IsNull]

@sjswoboda The cause in our case was that we used to export the index.ts files by omiting their name:

export * from 'components/myfeature' (to export components/myfeature/index.ts)
However, this is not supported by ng/ngc and as a workaround we had to explicitly name the index:
export * from 'components/myfeature/index'

However, all the tooling and standards explicitly allow to omit the index name...

See #7394 for the bug report.

[sjswoboda]

@isNull -- yes absolutely! That's one thing we had to do as well. We explicitly reference the index file as well. Sorry; I had forgotten that we had also done that.

[haidaraM]

I had this issue when I upgraded yarn to 1.2.1. If I rollback to 1.0.0, it works. Maybe there is a newer version between 1.0.0 and 1.2.1 that works. I will keep 1.0.0 for the moment

[javahaxxor]

just ran into this issue upgrading from angular-cli 1.3 to 1.5.5. Removed node_modules , reinstalled with NPM - same. Removed node_modules, reinstalled with yarn - same. Removed node_modules, removed all yarn-related files, reinstalled with npm, and it worked. VERY strange

[HaithamMaya]

I ran into this same issue, and I don't use yarn. Here is the only way it fixed it for me:
rm -rf node_modules package-lock.json npm install ng s

[sanyooh]

I ran into the same issue, this fixed it for me, see reference here: https://github.com/angular/angular-cli/issues/6425

Here are the versions I used to get it running:

yarn: 1.1.0,
angular-cli: 1.4.7,
typescript: 2.2.2

[Fred-JulieDesk]

I ran into the same issue myself with Yarn, using this package.lock =>

 "dependencies": {
    "@angular/animations": "4.4.7",
    "@angular/cdk": "2.0.0-beta.10",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/compiler-cli": "^4.2.2",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/material": "2.0.0-beta.10",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/platform-server": "^4.2.2",
    "@angular/router": "^4.0.0",
    "@ngui/tooltip": "^0.5.1",
    "@ngx-translate/core": "^6.0.0",
    "@ngx-translate/http-loader": "^0.1.0",
    "@types/intro.js": "^2.4.3",
    "@types/protractor-http-mock": "0.0.33",
    "@types/underscore": "^1.8.1",
    "aes-js": "3.1.0",
    "angular2-fontawesome": "~0.9.0",
    "angular2-oauth2": "^1.3.10",
    "angular2-tooltip": "^3.1.0",
    "core-js": "^2.4.1",
    "crypto-js": "3.1.9-1",
    "font-awesome": "~4.7.0",
    "intro.js": "^2.9.3",
    "jquery": "^3.2.1",
    "jqueryui": "^1.11.1",
    "jsuri": "^1.3.1",
    "localize-router": "^0.7.0",
    "ng2-accordion": "0.0.15",
    "ng2-selectize": "^1.0.1",
    "ngx-bootstrap": "^1.7.1",
    "ngx-tooltip": "0.0.9",
    "npm": "^5.8.0",
    "rxjs": "^5.1.0",
    "selectize": "^0.12.4",
    "underscore": "^1.8.3",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@angular/cli": "1.2.6",
    "@angular/compiler-cli": "^4.0.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "~6.0.60",
    "codelyzer": "~2.0.0",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "ng-mock-e2e": "~0.1.3",
    "protractor": "~5.1.0",
    "protractor-http-mock": "^0.9.2",
    "string-replace-loader": "^2.1.1",
    "ts-node": "~2.0.0",
    "tslint": "~4.5.0",
    "typescript": "2.2.0"
  }

Which produced the same error as outlined above.

In my case the problem was the installed Typescript version that seems to not be compatible with the @angular/cli version

After upgrading to Typescript 2.3.4, I got it working fine, and could use AOT compiler with yarn

[angular-automatic-lock-bot[bot]]

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