Bazel + Ivy (--define=compile=aot) fails with TS-966002

[qzmfranklin]

Using Angular 8.2.0-next.2.

Enabling --define=compile=aot (Ivy) in bazel build fails. The relevant source codes are:

// qrcode.module.ts
import {CommonModule} from '@angular/common'
import {NgModule} from '@angular/core'

import {QrcodeComponent} from './component'

@NgModule({
    declarations: [QrcodeComponent],
    exports: [QrcodeComponent],
    imports: [CommonModule],
})
export class QrcodeModule {  // tslint:disable-line:no-unnecessary-class
}

// qrcode.component.ts
import {Component, OnInit, ViewEncapsulation} from '@angular/core'
import {toDataURL} from 'qrcode'

@Component({
    encapsulation: ViewEncapsulation.None,
    selector: 'qrcode',
    styleUrls: ['style.css'],
    templateUrl: 'template.html',
})
export class QrcodeComponent implements OnInit {
    public qrcodeText = 'https://www.logiocean.com'
    public history: string[] = []
    public imgSrc = ''

    public ngOnInit(): void {
        this.history.push(this.qrcodeText)
        this.updateQrcode()
    }

    public onEnter(value: string): void {
        this.qrcodeText = value
        this.history.unshift(value)
        this.updateQrcode()
    }

    private updateQrcode(): void {
        toDataURL(this.qrcodeText, (error: Error, url: string) => {
            if (!error)
                this.imgSrc = url
        })
    }
}

The error message:

INFO: Analyzed target //src/web/apps/debug:devserver (0 packages loaded, 0 targets configured).
INFO: Found 1 target...
INFO: Writing explanation of rebuilds to 'build/logs'
ERROR: /mnt/data/git/LogiOcean/src/web/components/basic/qrcode/BUILD:1:1: Compiling Angular templates (ngtsc) //src/web/components/basic/qrcode:qrcode failed (Exit 1)
external/npm/node_modules/@angular/common/common.d.ts(115,22): error TS-996002: Appears in the NgModule.imports of QrcodeModule, but could not be resolved to an NgModule class

Target //src/web/apps/debug:devserver failed to build
ERROR: /mnt/data/git/LogiOcean/src/web/apps/debug/BUILD:44:1 Compiling Angular templates (ngtsc) //src/web/components/basic/qrcode:qrcode failed (Exit 1)
INFO: Elapsed time: 7.226s, Critical Path: 6.73s
INFO: 0 processes.
FAILED: Build did NOT complete successfully

For the record, the above code compiles just fine without AOT.

I searched around and found many similar issues:

angular/angular#31616
angular/angular#31629
angular/angular#31785
(many more omitted here for brevity)

Most of the issues have the TS-996002 string in it. Looks like this is an Angular issue, not ours. Would like some confirmation or explanation here.

Moreover, I do not see any formal documentation on the best way to enable Ivy in Bazel. I found --define=compile=aot by digging the source code in Angular's Bazel .bzl files. But I do not know if that is the way to go. Would like to understand better.

Thanks in advance.

[alexeagle]

There are a couple issues which should be solved this week, then we will switch this example repo to Ivy and I expect it will work for you too.

[qzmfranklin]

Thanks for the reply. Looking forward.

[DenisLaboureyras]

Hello, do you have an ETA to switch this repo to ivy, and maybe the angular 9 beta ?

[alexeagle]

Yes I think @gregmagolan has that green...

[alexeagle]

let's follow up in bazel-contrib/rules_nodejs#1127