angular: Enable ivy in angular 8 - production build got failed
š Bug report
Command (mark with an x
)
- [ ] new
- [x] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc
Is this a regression?
Yes
Description
I have created an angular project with enabling ivy mode using below commands
ng new hello-ivy --enable-ivy
When I try to serve my application using below command
ng serve
it does not throw any compilation error but when I try to load this in browser [chrome] it throws below error:
When i try to take prod build using below command
ng build --prod
it throws below compilation error :
I donāt know why this issue occurs
š¬ Minimal Reproduction
-
Download below sample - ivySample.zip
-
Give below command to install our third-party package
npm i @syncfusion/ej2-angular grids
Or Download this and place it inside node_modules folder
š Your Environment
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ ā³ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 8.0.1
Node: 10.16.0
OS: win32 x64
Angular: 8.0.0
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.800.1
@angular-devkit/build-angular 0.800.1
@angular-devkit/build-optimizer 0.800.1
@angular-devkit/build-webpack 0.800.1
@angular-devkit/core 8.0.1
@angular-devkit/schematics 8.0.1
@angular/cli 8.0.1
@ngtools/webpack 8.0.1
@schematics/angular 8.0.1
@schematics/update 0.800.1
rxjs 6.4.0
typescript 3.4.5
webpack 4.30.0
Anything else relevant?
Working fine angular 8 production build without ivy mode
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Comments: 40 (15 by maintainers)
@kumaresan-subramani the issue with the type checker has not been resolved yet, as itās quite tricky to deal with properly. We are working on implementing additional
"strict*"
flags so that the type checking can be less strict for the time being, which we hope to land within the coming two weeks.The error is in the IVY compiler template type checkerā¦ It looks, from first glance, like the compiler is not recognizing the
<esj-grid>
tag as a component that has an input calleddataSource
.I think this is because the ej2 components use a dynamic mixin approach to creating their components and this component doesnāt statically declare
dataSource
as a property on theGridComponent
class. See https://github.com/syncfusion/ej2-angular-ui-components/blob/2b12b0202728b6e634cb1c8adb9650b2843fdbd0/components/grids/src/grid/grid.component.tsThis should be fixed in v8.1.0-rc.0 - @kumaresan-subramani can you check?
@alexzuza Itās known, see #30795
@syncfusion/ej2-ng-grids
is not bootstrapping as its lifecycle methods are provided by a mixin mechanism that are not visible to the Ivy runtime, as they are bound too late. Related issue: #31495@kumaresan-subramani Please update everything Angular related: all
@angular
packages together with@angular/angular-cli
and also@angular-devkit
I notice that you are running Angular v8.0.1. This is not the correct version for trying out IVY. You should install the
next
version. E.g.@kumaresan-subramani I think we need to fix all external packages that caused this issue.
@kumaresan-subramani I use 9.0.0 beats and rcs versions for a long time, itās works as expected.
@kumaresan-subramani try 9.0.0-rc.4, maybe this fixed in next versions.
my project is in angular 8 i want enable Ivy in my project but after enable that I am getting error in ngx bootstrap
ERROR in Failed to find exported name of node (class BsDatepickerDayDecoratorComponent { })
I am getting this error
@kumaresan-subramani I have a feeling thereās an issue with compiling the library that has
ejs-grid
using ngcc, which results in theejs-grid
element not representing a component. You are using Ivy in v8.x, which has not received relevant Ivy fixes for a very long time, so I would request you try Ivy with the latest 9.x next release.HI @alxhub ,
Any update on this query?
Is this workaround for this since you fix this issue
https://github.com/angular/angular/issues/30114#issuecomment-509016276
By dynamic mixin approach I am referring to this line of code:
I accept that this might be a red herring in this case as the problem is more likely caused by the component not having the relevant input declared as a typed property on the class.
But it is likely to have an impact in the compiler knowing whether relevant lifecycle methods are available on the component.
It would be interesting to see if this project can be compiled using the ngtsc compiler from source which could show that the problem is in the ngcc compiler.
Whatās the status of this? I get the same error:
ERROR in Unexpected value āPostService in C:/myAngularApp/src/app/service/posts. component.tsā declared by the module āAppModule in C:/myAngularApp/src/app/app.m odule.tsā. Please add a @Pipe/@Directive/@component annotation.
@petebacondarwin
Just tried it with ā@angular/compiler-cliā: ānextā, which is 8.1.0-beta.0
Seems Esm5ReflectionHost looks for ādecoratorsā static property of function declaration inside IIFE and will never find.
ej2-angular-grids.es5.js
From source code
https://github.com/angular/angular/blob/815443313044e0ec0ec87af588d09eda6b88f0c8/packages/compiler-cli/ngcc/src/host/esm5_host.ts#L304-L310
This seems to be related to ngtsc, @petebacondarwin / @JoostK can you chime in?
I am seeing a different error though
which typically means that ngcc was not run properly.