Issue running $ ionic build --prod

Ionic Framework ionic-v3
1

I’m getting the following error:

Running app-scripts build: --prod
[19:18:02]  build prod started ...
[19:18:02]  clean started ...
[19:18:02]  clean finished in 1 ms
[19:18:02]  copy started ...
[19:18:02]  deeplinks started ...
[19:18:02]  deeplinks finished in 42 ms
[19:18:02]  ngc started ...
Error: Can't resolve all parameters for MyApp in /Users/rafa/natal-food/imoto-motoboys/src/app/app.component.ts: ([object Object], [object Object], [object Object], ?).
    at syntaxError (my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:1729:34)
    at CompileMetadataResolver._getDependenciesMetadata (my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15816:35)
    at CompileMetadataResolver._getTypeMetadata (my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15684:26)
    at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15279:24)
    at CompileMetadataResolver._getEntryComponentMetadata (my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15938:45)
    at my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15924:48
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver._getEntryComponentsFromProvider (my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15923:30)
    at my_project/node_modules/@angular/compiler/bundles/compiler.umd.js:15887:83
    at Array.forEach (<anonymous>)
[19:18:04]  copy finished in 2.43 s

Here is the related code:

constructor(
    public platform: Platform,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen,
    private motoboy: Motoboy,
  ) {

Yes, I have that class declared in providers in app.modules.ts, it successfully works without the --prod flag.

I tried to upgrade angular packages and it stacktrace mentioned AoT files, not sure what to do with it though.

$ ionic info

cli packages: (/Users/rafa/.nvm/versions/node/v9.5.0/lib/node_modules)

    @ionic/cli-utils  : 1.19.1
    ionic (Ionic CLI) : 3.19.1

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android 6.3.0 ios 4.5.4
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.1.1
    ios-deploy        : 1.9.2
    Node              : v9.5.0
    npm               : 5.6.0
    OS                : macOS High Sierra
    Xcode             : Xcode 9.2 Build version 9C40b

Environment Variables:

    ANDROID_HOME : /Users/rafa/Library/Android/sdk

Misc:

    backend : pro

Anyone has a clue?

Thanks!

1 Like
2

Here’s the error with latest angular:

➜  imoto-motoboys git:(master) ✗ ionic build --prod
Running app-scripts build: --prod
[21:43:34]  build prod started ...
[21:43:34]  clean started ...
[21:43:34]  clean finished in 1 ms
[21:43:34]  copy started ...
[21:43:34]  deeplinks started ...
[21:43:34]  deeplinks finished in 49 ms
[21:43:34]  ngc started ...
[21:43:38]  typescript error
            Can't resolve all parameters for MyApp in /my_project/src/app/app.component.ts:
            ([object Object], [object Object], [object Object], ?).

Error: The Angular AoT build failed. See the issues above
    at /my_project/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/my_project/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/my_project/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/my_project/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[21:43:38]  copy finished in 3.32 s

$ ionic info

cli packages: (/Users/rafa/.nvm/versions/node/v8.9.4/lib/node_modules)

    @ionic/cli-utils  : 1.19.1
    ionic (Ionic CLI) : 3.19.1

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android 6.3.0 ios 4.5.4
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.1.1
    ios-deploy        : 1.9.2
    Node              : v8.9.4
    npm               : 5.6.0
    OS                : macOS High Sierra
    Xcode             : Xcode 9.2 Build version 9C40b

Environment Variables:

    ANDROID_HOME : /Users/rafa/Library/Android/sdk

Misc:

    backend : pro
3

I’ve been trying for a day now, can’t manage to solve this problem, no one has any clue?

4 
Can't resolve all parameters for MyApp in /my_project/src/app/app.component.ts:
([object Object], [object Object], [object Object], ?).

I’ve never used --prod but does ionic serve even work without that typescript error ? I can imagen if you solve this error it will work.

5

Yes, I’ve developed the entire app normally on my cellphone using dev builds.

➜  imoto-motoboys git:(master) ionic build
Running app-scripts build:
[13:19:41]  build dev started ...
[13:19:41]  clean started ...
[13:19:41]  clean finished in 1 ms
[13:19:41]  copy started ...
[13:19:41]  deeplinks started ...
[13:19:41]  deeplinks finished in 45 ms
[13:19:41]  transpile started ...
[13:19:44]  transpile finished in 3.25 s
[13:19:44]  preprocess started ...
[13:19:44]  preprocess finished in less than 1 ms
[13:19:44]  webpack started ...
[13:19:44]  copy finished in 3.40 s
[13:19:50]  webpack finished in 6.31 s
[13:19:50]  sass started ...
Without `from` option PostCSS could generate wrong source map and will not find Browserslist config. Set it to CSS file path or to `undefined` to prevent this warning.
[13:19:51]  sass finished in 1.00 s
[13:19:51]  postprocess started ...
[13:19:51]  postprocess finished in 6 ms
[13:19:51]  lint started ...
[13:19:51]  build dev finished in 10.72 s
> ionic cordova prepare --no-build
> cordova prepare

[13:19:54]  lint finished in 2.82 s

My service is correctly setup, I believe, check it out:

app.module.ts

File: https://gist.github.com/rafbgarcia/857d74fc57b67522eb0bd325697035a1

Related code snippet:

import Motoboy from '../services/motoboy'
...
  providers: [
    Motoboy,

motoboy.ts

File: https://gist.github.com/rafbgarcia/0af25d0b1d784665576047f62332f47e

Code snippet:

import { Injectable } from '@angular/core'
import { Storage } from '@ionic/storage'

@Injectable()
export default class Motoboy {
  constructor(
    public storage: Storage
  ) {}
...

app.component.ts

File: https://gist.github.com/rafbgarcia/6d4542a4549e62528f2acfff93638c35

Related code snippet:

import Motoboy from '../services/motoboy'

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  @ViewChild(Nav) nav: Nav

  rootPage: any

  pages: Array<{title: string, component: any}>

  constructor(
    public platform: Platform,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen,
    public motoboy: Motoboy,
  ) {
...

Can you see any errors there? Please let me know if you do!

1 Like
6

You could try to downgrade your cordova package to v7.1.0.

7

Thanks for the suggestion!

Didn’t work :frowning:

➜  imoto-motoboys git:(master) npm i -g cordova@7.1.0
npm WARN deprecated node-uuid@1.4.8: Use uuid module instead
/Users/rafa/.nvm/versions/node/v8.9.4/bin/cordova -> /Users/rafa/.nvm/versions/node/v8.9.4/lib/node_modules/cordova/bin/cordova
+ cordova@7.1.0
added 212 packages, removed 5 packages and updated 7 packages in 10.869s
➜  imoto-motoboys git:(master) n
➜  imoto-motoboys git:(master) cordova -v
7.1.0
➜  imoto-motoboys git:(master) ionic build --prod
Running app-scripts build: --prod
[13:35:06]  build prod started ...
[13:35:06]  clean started ...
[13:35:06]  clean finished in 3 ms
[13:35:06]  copy started ...
[13:35:06]  deeplinks started ...
[13:35:06]  deeplinks finished in 43 ms
[13:35:06]  ngc started ...
[13:35:09]  typescript error
            Can't resolve all parameters for MyApp in /Users/rafa/natal-food/imoto-motoboys/src/app/app.component.ts:
            ([object Object], [object Object], [object Object], ?).

Error: The Angular AoT build failed. See the issues above
    at /Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[13:35:09]  copy finished in 3.18 s
8

I’ve been trying to upgrade/downgrade many packages, so this is my updated $ ionic info:

cli packages: (/Users/rafa/.nvm/versions/node/v8.9.4/lib/node_modules)

    @ionic/cli-utils  : 1.19.1
    ionic (Ionic CLI) : 3.19.1

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.8
    Cordova Platforms  : android 6.3.0 ios 4.5.4
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.1.1
    ios-deploy        : 1.9.2
    Node              : v8.9.4
    npm               : 5.6.0
    OS                : macOS High Sierra
    Xcode             : Xcode 9.2 Build version 9C40b

Environment Variables:

    ANDROID_HOME : /Users/rafa/Library/Android/sdk

Misc:

    backend : pro
9

Just a suggestion, maybe you should try to remove your parameters from your app.component.ts to see if it would work.

Just use the default one from a startapplication, import your Pages and define the Rootpage and test it.
Maybe you get a working result!

1 Like
10

I’ve tried that, it gives me another nonsense error:

1st step

Commented out Motoboy related code in app.component.ts

➜  imoto-motoboys git:(master) ✗ ionic build --prod
Running app-scripts build: --prod
[13:44:10]  build prod started ...
[13:44:10]  clean started ...
[13:44:10]  clean finished in 1 ms
[13:44:10]  copy started ...
[13:44:10]  deeplinks started ...
[13:44:10]  deeplinks finished in 47 ms
[13:44:10]  ngc started ...
[13:44:14]  typescript error
            Can't resolve all parameters for VerifyCodePage in
            /Users/rafa/natal-food/imoto-motoboys/src/pages/login/verify_code.ts: ([object Object], [object Object],
            [object Object], [object Object], [object Object], ?).

Error: The Angular AoT build failed. See the issues above
    at /Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[13:44:14]  copy finished in 3.65 s

2nd step

commented out Motoboy related code in verify_code.ts

➜  imoto-motoboys git:(master) ✗ ionic build --prod
Running app-scripts build: --prod
[13:45:06]  build prod started ...
[13:45:06]  clean started ...
[13:45:06]  clean finished in 1 ms
[13:45:06]  copy started ...
[13:45:06]  deeplinks started ...
[13:45:07]  deeplinks finished in 44 ms
[13:45:07]  ngc started ...
[13:45:10]  typescript error
            Unexpected value 'null' declared by the module 'AppModule in
            /Users/rafa/natal-food/imoto-motoboys/src/app/app.module.ts'

Error: The Angular AoT build failed. See the issues above
    at /Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[13:45:10]  copy finished in 3.60 s

3rd step

Commented out Motoboy related code in app.module.ts

➜  imoto-motoboys git:(master) ✗ ionic build --prod
Running app-scripts build: --prod
[13:47:48]  build prod started ...
[13:47:48]  clean started ...
[13:47:48]  clean finished in 1 ms
[13:47:48]  copy started ...
[13:47:48]  deeplinks started ...
[13:47:48]  deeplinks finished in 48 ms
[13:47:48]  ngc started ...
[13:47:52]  typescript error
            Unexpected value 'null' declared by the module 'AppModule in
            /Users/rafa/natal-food/imoto-motoboys/src/app/app.module.ts'

Error: The Angular AoT build failed. See the issues above
    at /Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[13:47:52]  copy finished in 3.77 s

4th step

Not sure what else I can do :frowning:

11

Try doing only this in your app.component.ts.

import { Component, ViewChild } from '@angular/core'
import { Nav, Platform } from 'ionic-angular'
import { StatusBar } from '@ionic-native/status-bar'
import { SplashScreen } from '@ionic-native/splash-screen'

import HomePage from '../pages/home/home'
import LoginPage from '../pages/login/login'
import Motoboy from '../services/motoboy'

@Component({
  templateUrl: 'app.html'
})
export class MyApp {


  rootPage: any = HomePage;

  constructor(
    public platform: Platform,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen,
    public motoboy: Motoboy,
  ) {
platform.ready().then(() => {
      statusBar.styleDefault();
      splashScreen.hide();
   });
  }
}

If it still gives an error comment public motoboy: Motoboy and import Motoboy from '../services/motoboy' then try again. Hope this time it builds something!

12

Did what you said, at the end of the road it gave me the same error on app.module.ts

➜  imoto-motoboys git:(master) ✗ ionic build --prod
Running app-scripts build: --prod
[13:58:52]  build prod started ...
[13:58:52]  clean started ...
[13:58:52]  clean finished in 1 ms
[13:58:52]  copy started ...
[13:58:52]  deeplinks started ...
[13:58:52]  deeplinks finished in 41 ms
[13:58:52]  ngc started ...
[13:58:55]  typescript error
            Unexpected value 'null' declared by the module 'AppModule in
            /Users/rafa/natal-food/imoto-motoboys/src/app/app.module.ts'

Error: The Angular AoT build failed. See the issues above
    at /Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[13:58:55]  copy finished in 3.61 s
13

Can you comment out all motoboy related stuff in app.modules.ts ? Since it doesn’t know how to handle with a null value.

14

Check this out, removed everything from app.module.ts and app.component.ts

app.module.ts

import { BrowserModule } from '@angular/platform-browser'
import { ErrorHandler, NgModule } from '@angular/core'
import { HttpClientModule } from '@angular/common/http'

import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'
import { IonicStorageModule } from '@ionic/storage'
import { StatusBar } from '@ionic-native/status-bar'
import { SplashScreen } from '@ionic-native/splash-screen'
import { OneSignal } from '@ionic-native/onesignal'
import { InAppBrowser } from '@ionic-native/in-app-browser';

import { ApolloModule, Apollo } from 'apollo-angular'
import { HttpLinkModule, HttpLink } from 'apollo-angular-link-http'
import { TextMaskModule } from 'angular2-text-mask'
import { InMemoryCache } from 'apollo-cache-inmemory'
import { HttpHeaders } from '@angular/common/http'
import { setContext } from 'apollo-link-context'

import { MyApp } from './app.component'
import HomePage from '../pages/home/home'

@NgModule({
  declarations: [
    MyApp,
    HomePage,
  ],
  imports: [
    HttpClientModule,
    ApolloModule,
    HttpLinkModule,
    BrowserModule,
    TextMaskModule,
    IonicStorageModule.forRoot(),
    IonicModule.forRoot(MyApp),
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
  ],
  providers: [
    OneSignal,
    InAppBrowser,
    StatusBar,
    SplashScreen,
    IonicErrorHandler,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})

export class AppModule {}

app.component.ts

import { Component, ViewChild } from '@angular/core'
import { Nav, Platform } from 'ionic-angular'
import { StatusBar } from '@ionic-native/status-bar'
import { SplashScreen } from '@ionic-native/splash-screen'

import HomePage from '../pages/home/home'

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage: any = HomePage;

  constructor(
    public platform: Platform,
    public statusBar: StatusBar,
    public splashScreen: SplashScreen,
  ) {
    platform.ready().then(() => {
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }
}

$ ionic build --prod

Running app-scripts build: --prod
[14:03:42]  build prod started ...
[14:03:42]  clean started ...
[14:03:42]  clean finished in 1 ms
[14:03:42]  copy started ...
[14:03:42]  deeplinks started ...
[14:03:42]  deeplinks finished in 43 ms
[14:03:42]  ngc started ...
[14:03:45]  typescript error
            Unexpected value 'null' declared by the module 'AppModule in
            /Users/rafa/natal-food/imoto-motoboys/src/app/app.module.ts'

Error: The Angular AoT build failed. See the issues above
    at /Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:237:55
    at step (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:32:23)
    at Object.next (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:13:53)
    at fulfilled (/Users/rafa/natal-food/imoto-motoboys/node_modules/@ionic/app-scripts/dist/aot/aot-compiler.js:4:58)
    at <anonymous>
[14:03:45]  copy finished in 3.69 s

I’m gonna try to remove all my external packages, let’s see what happens.

15

You can run ngc command and see the exactly error;

16

LOL, dude, do you know what was it? I can’t believe I lost 15 hours on this, seriously.

Apparently I can’t export default class, this was the entire ******* issue.

My steps:

Step 1

Create a new ionic project and make check whether $ ionic build --prod works.

It did work.

Step 2

Try to make the build fail.

I achieved that creating a service and trying to use it in app.component.ts

import { Injectable } from '@angular/core'

@Injectable()
export default class Service {
  constructor() {}
}

Step 3

Try to make the build pass.

Updated my service to do an export class Service instead of export default class Service

import { Injectable } from '@angular/core'

@Injectable()
export class Service {
  constructor() {}
}

It passed.

Conclusion

Both errors were solved by that.

1- app.component.ts -> Can't resolve all parameters for MyApp [...]
2- app.module.ts -> Unexpected value 'null' declared by the module 'AppModule in [...]

Thanks for your help @cherry

1 Like