1

After upgrading my Angular2 project to Angular4 using:

npm install @angular/common@latest @angular/compiler@latest @angular/compiler-cli@latest @angular/core@latest @angular/forms@latest @angular/http@latest @angular/platform-browser@latest @angular/platform-browser-dynamic@latest @angular/platform-server@latest @angular/router@latest @angular/animations@latest typescript@latest --save

I receive the following error when I use ng build --prod:

ERROR in ./src/main.ts Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in 'D:\workspace\MyProject\src' @ ./src/main.ts 4:0-74 @ multi ./src/main.ts

Without the --prod flag I don't get any errors. There are a few similar questions on stackoverflow but without any accepted answers and not related with the upgrade to Angular4. Here is my package.json:

{ "name": "MyProject", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^4.0.0", "@angular/common": "^4.0.0", "@angular/compiler": "^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", "@angular/platform-server": "^4.0.0", "@angular/router": "^4.0.0", "angular-2-dropdown-multiselect": "^1.0.5", "angular2-uuid": "^1.1.1", "bootstrap": "^3.3.7", "core-js": "^2.4.1", "font-awesome": "^4.7.0", "jquery": "^3.1.1", "ng2-adal": "^0.3.0", "rxjs": "^5.1.0", "zone.js": "^0.8.4" }, "devDependencies": { "@angular/cli": "1.0.0", "@angular/compiler-cli": "^4.0.0", "@types/jasmine": "2.5.46", "@types/node": "~7.0.11", "codelyzer": "~2.0.0", "jasmine-core": "~2.5.2", "jasmine-spec-reporter": "~3.2.0", "karma": "~1.5.0", "karma-chrome-launcher": "~2.0.0", "karma-cli": "~1.0.1", "karma-coverage-istanbul-reporter": "^1.0.0", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.0", "ts-node": "~2.0.0", "typescript": "^2.2.1", "tslint": "~4.5.0" } }

Edit. Here is a project.json created with ng new and the new CLI:

{ "name": "mypro", "version": "0.0.0", "license": "MIT", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/common": "^4.0.0", "@angular/compiler": "^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", "@angular/router": "^4.0.0", "core-js": "^2.4.1", "rxjs": "^5.1.0", "zone.js": "^0.8.4" }, "devDependencies": { "@angular/cli": "1.0.0", "@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.0.0", "karma-cli": "~1.0.1", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "karma-coverage-istanbul-reporter": "^0.2.0", "protractor": "~5.1.0", "ts-node": "~2.0.0", "tslint": "~4.5.0", "typescript": "~2.2.0" } }

Any suggestions?

Improve this question
6
  • 1
    How does your package.json compare to one from ng new with your version of the CLI? Commented Mar 26, 2017 at 15:56
  • @jonrsharpe Good point, I already tried to play with the versions but keep getting the same error message. I will post the package.json created with ng new with the new CLI version. Commented Mar 26, 2017 at 16:03
  • 1
    Does the build work when you try this: ng build --prod --aot false? Commented Mar 26, 2017 at 18:53
  • @R.Richards Yes, the build work without error if I add the --aot false parameter. Any idea whats going wrong? Commented Mar 26, 2017 at 19:29
  • 1
    The default build compile mode now is AOT compilation, despite what the wiki might say on angular.io. You have to go through some extra steps in your code to get AOT to work, or avoid it by setting the flag to false. angular.io/docs/ts/latest/cookbook/aot-compiler.html. When I have run into issues with AOT, I usually get better error messages than what you show. At least a component name, or something. Commented Mar 26, 2017 at 19:38

1 Answer 1

Reset to default
8

You can get your application to build, but you will more than likely need to include the --aot false parameter along with --prod in order for it to work. See below.

ng build --prod --aot false

The default production build compile mode is AOT compilation now. You have to go through some extra steps in your code to get AOT to work, or avoid it by setting the flag to false. The AOT Cookbook should be of some help.

The GitHub wiki for ng build indicates that the default value for the --aot flag is false, but that doesn't seem to be the case. ng build --help doesn't show that there is a default value. Using the flag shows/proves that the default is true.

When I have run into issues with AOT, I usually get better error messages than what you show in your question; at least a component name, or something that tells me where to look. Many of what I end up seeing in my errors are things like not explicitly declaring a variable in a component. JIT doesn't care about that, but AOT doesn't like it at all.

Hope this helps you out.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.