No production builds with AOT possible (--prod flag)

[marcorinck]

I'm currently working on a new ionic project and trying out TypeORM. While trying to do my first production build for testing out typeorm/typeorm#2419 I found that its currently not possible to build ionic (angular) projects with AoT compiler (ahead of time) turned on when typeORM is included, including this example project.

When using the term "production build" I mean this command: "ionic cordova build ios --prod --release" (the --prod flag is the problematic one).

There are three problems:

1. In its current state this example project is using angular 4.x with typescript 2.9 ("^2.7.1") despite that angular 4 only works with TS 2.3 but it was not specified in its package.json so you get no warning when installing it. The dev and prod builds both finish without any error however as the angular compiler doesn't (yet) complain about the wrong TS version., but I can't open the prod version of the app after a prod build. I only get this error:

vendor.js:1 Uncaught Error: Cannot find module "."
    at vendor.js:1
    at vendor.js:1
    at Object.<anonymous> (vendor.js:1)
    at e (vendor.js:1)
    at Object.241 (main.js:1)
    at e (vendor.js:1)
    at window.webpackJsonp (vendor.js:1)
    at main.js:1

2. As ionic 3.x doesn't support the current angular version of 6.0.7 I next updated to the last angular5 version of 5.2.10. After I did this, every production build failed, because the angular AOT compiler will now fail the build because of the wrong TS version. After downgrading TS to 2.6.2 (the last supported TS version in angular5), I got this error message during production build:

TypeError: Cannot read property 'kind' of undefined
    at nodeCanBeDecorated (/Users/mzrinck/projects/ionic-example/node_modules/typescript/lib/typescript.js:8376:36)
    at nodeIsDecorated (/Users/mzrinck/projects/ionic-example/node_modules/typescript/lib/typescript.js:8396:16)
    at Object.nodeOrChildIsDecorated (/Users/mzrinck/projects/ionic-example/node_modules/typescript/lib/typescript.js:8400:16)
    at isDecoratedClassElement (/Users/mzrinck/projects/ionic-example/node_modules/typescript/lib/typescript.js:53700:23) 

The cause of this is a typescript bug which is only fixed in TS 2.7.x, see angular/angular-cli#8434 The problem seems to be a bug when arrow functions are used in decorators (which typeorm uses frequently) and the angular AoT compiler triggers this.

That means this can't be fixed in a current ionic 3.x project as only ionic 4.x will officially support angular6 and TS >= 2.7.

Oh, and btw, the same happens when doing this in angular4 and TS 2.4.

3. Even when upgrading to angular and rxjs to 6.0.7 (and including rxjs-compat package and ignoring ionic dependency warning) will not work. Development builds are working at first glance and prod builds work without any error butthe resulting application will not run as I only got this error:

vendor.js:1 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'Database' of undefined
TypeError: Cannot read property 'Database' of undefined
    at n.<anonymous> (vendor.js:1)
    at vendor.js:1
    at Object.next (vendor.js:1)
    at vendor.js:1
    at new t (polyfills.js:3)
    at l (vendor.js:1)
    at n.createDatabaseConnectionWithImport (vendor.js:1)
    at n.load (vendor.js:1)
    at n.createDatabaseConnection (vendor.js:1)
    at n.<anonymous> (vendor.js:1)
    at n.<anonymous> (vendor.js:1)

This is a problem with the SqlJs driver (in its createDatabaseConnectionWithImport method). I don't know if its caused by angular6 but I doubt it. I guess this error would be thrown even in the other versions when they would work and it seems to be caused by optimizations maybe? I don't know, I'm not an expert enough.

In the end, there is currently no way to do ANY builds with --prod flag when I include typeORM to my project. As ionic 4.x seems to be released in the coming months, problem 1 and 2 will be fixed as TS 2.7 can be used then, but I'm not so sure about 3.

[kgeoir]

I exactly have the same issue: ionic3 + TypeORM.
I tested with tsc version 2.6.2 or 2.9.2 I always have this error
TypeError: Cannot read property 'kind' of undefined at nodeCanBeDecorated (/Users/pohaye/workspace/evs/app/EnVoitureSimone/node_modules/typescript/lib/typescript.js:8376:36) at nodeIsDecorated (/Users/pohaye/workspace/evs/app/EnVoitureSimone/node_modules/typescript/lib/typescript.js:8396:16) at Object.nodeOrChildIsDecorated (/Users/pohaye/workspace/evs/app/EnVoitureSimone/node_modules/typescript/lib/typescript.js:8400:16)

For now what I did is to edit the failing line and adding:
if (!node.parent) { return true;}
Now i have other errors in Rxjs:
typescript: node_modules/ionic-native/node_modules/rxjs/Subject.d.ts, line: 16 Class 'Subject<T>' incorrectly extends base class 'Observable<T>'. Types of property 'lift' are incompatible. Type '<R>(operator: Operator<T, R>) => Observable<T>' is not assignable to type '<R>(operator: Operator<T, R>) => Observable<R>'. Type 'Observable<T>' is not assignable to type 'Observable<R>'. Type 'T' is not assignable to type 'R'.

To make my project able to compile, I use TS 2.4.0 + the fix in typescript.js.... Hopefully the application works....

[pacMakaveli]

I've just stumbled upon the same issue. Any resolution to this? 7 days of work for absolutely nothing :(

[marcorinck]

The only "solution" you can currently do is building your releases without the --prod flag. As this turns off almost all optimizations this can have an performance impact depending on your app.

I highly doubt that typeorm is willing to change anything as its not caused by them. The claim that typeorm is working with ionic is cirrently a bit problematic though.

What you maybe can do, is updating to ionic 4 beta releases. As angular6 is supported you can update TS to 2.7 so the root cause is fixed. I don't know how stable they are though.

[pacMakaveli]

Building without the --prod flag gives me a white screen without any errors. I might try a new app and see if it's my app that's causing the white screen.

The usage of my app is quite high and skimming on performance is not really an option at the moment.

I believe Ionic 4 is PWA going forward, how well will that work with a Ionic 3 app? I haven't had the chance to properly look into PWA, but if this is the only solution going forward, I might have to bite the bullet..

[marcorinck]

My app (which is still a new and small project) builds and runs without a problem in the iOS simulator and on an iPad when omitting the --prod flag. Are you sure that you don't get any error message? In all my tries I always had error messages in the console.

Afaik, building for PWA in ionic4 is just an additional build target. You will still be able to use cordova for mobile OS. In the end, you will have to update to ionic4 anyway, as you cant stay on 3.x forever.

[JeongJun-Lee]

In my case, I can do aot build without any errors with Angular 5.2.11 + Ionic 3.9.2 + TypeScript 2.7.1 + @ionic/app-scripts 3.1.9. How about using app-script over 3.1.9? But I have another issue #26.

[exequielc]

I dealing with this issue for a long time till now. Any clue to fix this?

[marcorinck]

@exequielc There is nothing you can do. The root cause is a typescript bug which typeorm can't fix and the fix is only included in 2.7 which can't be used with angular 5.

My first tests with ionic 4 beta don't look promising either. As ionic4 projects are "just" an enhancement to a normal angular cli project now, all builds are done using the angular cli framework. And the angular guys specifically disabled building libraries which depend on node.js objects/methods, like "fs" or "path". Here is the statement by the angular devs why this was disabled: angular/angular-cli#9827 (comment)

Unfortunately, typeorm uses this as I get these errors when building a fresh ionic4 project after adding typeorm:

ERROR in ./node_modules/mkdirp/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/mzrinck/projects/ionic4/node_modules/mkdirp'
ERROR in ./node_modules/typeorm/platform/PlatformTools.js
Module not found: Error: Can't resolve 'fs' in '/Users/mzrinck/projects/ionic4/node_modules/typeorm/platform'
ERROR in ./node_modules/redis-parser/lib/hiredis.js
Module not found: Error: Can't resolve 'hiredis' in '/Users/mzrinck/projects/ionic4/node_modules/redis-parser/lib'
ERROR in ./node_modules/redis/index.js
Module not found: Error: Can't resolve 'net' in '/Users/mzrinck/projects/ionic4/node_modules/redis'
ERROR in ./node_modules/mkdirp/index.js
Module not found: Error: Can't resolve 'path' in '/Users/mzrinck/projects/ionic4/node_modules/mkdirp'

This already happens for a local development build so no build is possible at all in ionic4.

I'm sorry, but the claim that typeorm is supporting ionic is wrong at the moment.

@pleerock I think you can't do anything to support ionic3. To support ionic4 you'd have to get rid of the dependency of node built-in objects for the browser platform.

Here is an example project with ionic4 and typeorm: https://github.com/marcorinck/typeorm-ionic4-test

[JeongJun-Lee]

I think this issue is critical. Is it possible to ask TypeScript team to merge to 2.6.x by the cherry-pick if the root cause is a typescript bug which the fix is only included in 2.7.x. Or the Ionic production build command should provide a option to make aot disable, but currently it's also impossible. Ionic doesn't support to disable aot in production build.

[Added]
I asked Ionic team to make aot disabled in production build by this issue ionic-team/ionic-app-scripts#1460

[aymehri]

Will this issue be resolved after the support of ionic 4?

[nextbyn]

@marcorinck @pleerock

Still waiting for a workaround I have a project already to launch in production (--prod) with ionic-cli 3.9.2 and typeorm 2.9
I tried several changes and nothing seems to fix this.

[exequielc]

Hi, what about this issue ?