Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support Angular 5 #69

Closed
elclanrs opened this issue Oct 19, 2017 · 19 comments
Closed

Support Angular 5 #69

elclanrs opened this issue Oct 19, 2017 · 19 comments

Comments

@elclanrs
Copy link

I tried in Angular 5.0.0-rc.3 and I get an error the regarding the OpaqueToken export which is deprecated.

According to angular/angular#14427 you may just need replace these with InjectionToken instead.

@gund
Copy link
Owner

gund commented Oct 19, 2017

Yes, I will prepare an upgraded version very soon.

@gund
Copy link
Owner

gund commented Oct 22, 2017

Hey there!

Just published new next version of lib under next tag in NPM so you can go ahead and try it out:

$ npm install ng-dynamic-component@next

All changes are currently in separate next branch - until Angular 5 will be officially released.

@cankayacan
Copy link

https://github.com/cankayacan/ng5-dynamic-component-test

Getting this error:

Error: Unexpected value '[object Object]' imported by the module 'AppModule'. Please add a @NgModule annotation.

@nlgi
Copy link

nlgi commented Nov 2, 2017

Hi!

There is another bug with official release of Angular 5.

ERROR Error: Uncaught (in promise): Error: Unexpected value '[object Object]' imported by the module 'ImmeubleModule'. Please add a @NgModule annotation.

Indeed in dynamic.module.d.ts:

import { ComponentInjector } from './component-injector'; import { ModuleWithProviders, Type } from '@angular/core'; export declare class DynamicModule { static withComponents(components: Type<any>[], componentInjector?: Type<ComponentInjector>): ModuleWithProviders; }

No @NgModule annotation.

Many thanks,

@gund
Copy link
Owner

gund commented Nov 3, 2017

Hey, you will not see any annotations in the *.d.ts files - those are just for typescript compiler not runtime.
I guess this problem happens because I build it with RC5 and you are trying with actual release v5.

I will publish stable version with v5 so you can try it

@gund gund mentioned this issue Nov 5, 2017
@gund gund closed this as completed in #79 Nov 5, 2017
@rbleuse
Copy link

rbleuse commented Nov 6, 2017

Hello,

I still get the error message ERROR Error: Unexpected value '[object Object]' imported by the module 'MonthlyBonusModule'. Please add a @NgModule annotation.

Using ng5 - dynamic 2.0.1 & cli 1.5

@gund
Copy link
Owner

gund commented Nov 6, 2017

Hmm... I will try on a sample app later.
Thanks for reporting, reopening issue.

@gund gund reopened this Nov 6, 2017
@nlgi
Copy link

nlgi commented Nov 6, 2017

Yes, same for me. Good luck!

@lukaszbachman
Copy link

lukaszbachman commented Nov 6, 2017

I ran into the same issue today using CLI 1.5, NG 2.1 and ng-dynamic-component 2.0.1, like all the others.
I compared the generated JS bundle for ng-dynamic-component and another open source library which is not triggering exceptions just to find that the generated class does contain additional metadata.

TooltipModule.decorators = [
        { type: NgModule, args: [{
                    imports: [CommonModule],
                    declarations: [TooltipDirective, TooltipContainerComponent],
                    exports: [TooltipDirective],
                    entryComponents: [TooltipContainerComponent]
                },] },
    ];

This decorators property is not present in case of generated DynamicModule, so I bet that this is what's causing NG to error out. I'm not sure though why this happens.

@gund
Copy link
Owner

gund commented Nov 6, 2017

@lukaszbachman thanks for pointing to this, I will check why they are not appearing

@gund
Copy link
Owner

gund commented Nov 6, 2017

Just confirmed that NGC does not generate metadata anymore for the project...
I guess it's because Angular v5 by default strips any angular specific decorators to optimize bundle.
Need to look for any config flags how to turn it off...

@gund
Copy link
Owner

gund commented Nov 6, 2017

So I found this property called generateCodeForLibraries for angularCompilerOptions in tsconfig.json and I tried to set it to true and still did not get any decorators emitted...

Really weird.
Anyone has any idea what might be the issue?

@elclanrs
Copy link
Author

elclanrs commented Nov 6, 2017

@gund, this seems to be related angular/angular#20219

@gund
Copy link
Owner

gund commented Nov 6, 2017

@elclanrs looks interesting but they are talking about code-gen of ngfactorys and here we are not generating them.
In our case there are not a single decorator being emitted by the NGC.

I just tried to use TSC with the same config and it did output all decorators - so it's purely NGCs issue now.

Trying to build a reproduction app now...

@shlomiassaf
Copy link

very simple, use TS@2.4.2 not 2.5.3

The problem is angular not notifying about it

@shlomiassaf
Copy link

2.5.3 support can be tracked here angular/angular#20175

@gund
Copy link
Owner

gund commented Nov 6, 2017

Hey @shlomiassaf thanks for the info. Just tried with TS v2.4 and it did work.

Angular team already knows about the problem with decorators in TS v2.5 or it makes sense to create a repro app and link to the issue?

@shlomiassaf
Copy link

I don't know...
They know about it so work is on way...

The issues are with tsickle mostly, not emitting the decorators... other then that you can AOT compile an app and it will work...

Since it's one shot compile the data is kept

@gund gund closed this as completed in ed26415 Nov 6, 2017
@gund
Copy link
Owner

gund commented Nov 6, 2017

You can try v2.0.2 - should be fixed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

7 participants