Can't Use in Angular cli 22

[rumes]

Can't add vaadin in angular cli 22. If we use

main-polymer.ts

document.addEventListener('WebComponentsReady', () => {
  require('./main.ts');
  true;
});

because BoostrapModule wrap by another function in this case addEventListener it give error

Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.

[virusakos]

You probably getting this error because you are building with --aot option. Try building without --aot.

[rumes]

in 22 it is not a option it is embeded as i here. And as I here now on every angular2 3rd party library must have aot compatibility to use in angular cli. I thin vaadin not have that.

[Chabane]

with --aot I have this error :

Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.

[MarcelMalik]

Have the same problem :-/ :

Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
Error: Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
    at Object.resolveEntryModuleFromMain ([...]\node_modules\@ngtools\webpack\src\entry_resolver.js:121:15)
    at AotPlugin._setupOptions ([...]\node_modules\@ngtools\webpack\src\plugin.js:129:58)
    at new AotPlugin ([...]\node_modules\@ngtools\webpack\src\plugin.js:37:14)
    at Object.exports.getWebpackNonAotConfigPartial ([...]\node_modules\angular-cli\models\webpack-build-typescript.js:20
:13)
    at new NgCliWebpackConfig ([...]\node_modules\angular-cli\models\webpack-config.js:23:42)
    at Class.run ([...]\node_modules\angular-cli\tasks\serve-webpack.js:20:22)
    at [...]\node_modules\angular-cli\commands\serve.js:102:26
    at process._tickCallback (internal/process/next_tick.js:103:7)

[erdem-aslan]

Same here...

Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
Error: Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
    at Object.resolveEntryModuleFromMain (.../node_modules/@ngtools/webpack/src/entry_resolver.js:121:15)
    at AotPlugin._setupOptions (.../node_modules/@ngtools/webpack/src/plugin.js:129:58)
    at new AotPlugin (.../node_modules/@ngtools/webpack/src/plugin.js:37:14)
    at Object.exports.getWebpackNonAotConfigPartial (.../node_modules/angular-cli/models/webpack-build-typescript.js:20:13)
    at new NgCliWebpackConfig (.../node_modules/angular-cli/models/webpack-config.js:23:42)
    at Class.exports.default.Task.extend.run (.../node_modules/angular-cli/tasks/build-webpack.js:17:22)
    at Class.Command.extend.run (.../node_modules/angular-cli/commands/build.js:54:26)
    at Class.<anonymous> (.../node_modules/angular-cli/angular-cli/lib/models/command.js:152:17)
    at process._tickCallback (internal/process/next_tick.js:103:7)

[MarcelMalik]

I try to fixed the error with modifying the "entry_resolver.js" as suggested (https://github.com/angular/angular-cli/issues/2887) and changed line 109 from this: var bootstrap = source.findAstNodes(source.sourceFile, ts.SyntaxKind.CallExpression, false) to this: var bootstrap = source.findAstNodes(source.sourceFile, ts.SyntaxKind.CallExpression, true).

And move the content of main-polymer.ts to the main.ts file:

...
document.addEventListener('WebComponentsReady', () => {
  platformBrowserDynamic().bootstrapModule(AppModule);
});
// platformBrowserDynamic().bootstrapModule(AppModule);

but then I get problems with the registrations in the app.module.ts:

UnhandledPromiseRejection Warning: Unhandled promise rejection (rejection id: 1): Error: Error encountered resolving symbol values statically. Calling function 'PolymerElement', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function

[axtlotic]

I was trying some work around, and maybe this could help you:

main.ts

var webComponentsFlag = false;
document.addEventListener('WebComponentsReady',() =>{
  if (!webComponentsFlag)
    platformBrowserDynamic().bootstrapModule(AppModule);
  webComponentsFlag = true;
});
if (webComponentsFlag)
 platformBrowserDynamic().bootstrapModule(AppModule);

this allows to build the project

[Splaktar]

Seems to be a dupe of https://github.com/vaadin/angular2-polymer/issues/86. Note that the Angular CLI beta.22 is quite broken in a number of ways.

[axtlotic]

The two proposals I shared allowed to compile a project with Angular cli 22 (#111, #86), I hope helps you.

[Splaktar]

Angular CLI beta.23 is out and fixes an issue with stripping out custom decorators. It looks like this will still be a problem due to #86 though.

[jonathansolorzn]

Still no fix for this?

[GuzmanPI]

Is there any way to fix this?

[nunna-suma]

I'm also facing the same error

fallbackLoader option has been deprecated - replace with "fallback" loader option has been deprecated - replace with "use" fallbackLoader option has been deprecated - replace with "fallback" loader option has been deprecated - replace with "use" fallbackLoader option has been deprecated - replace with "fallback" loader option has been deprecated - replace with "use" fallbackLoader option has been deprecated - replace with "fallback" loader option has been deprecated - replace with "use" Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options. Error: Tried to find bootstrap code, but could not. Specify either statically an alyzable bootstrap code or pass in an entryModule to the plugins options. at Object.resolveEntryModuleFromMain (C:\practice\my-project\node_modules\@ngtools\webpack\src\entry_resolver.js:121:15) at AotPlugin._setupOptions (C:\practice\my-project\node_modules\@ngtools\webpack\src\plugin.js:174:50) at new AotPlugin (C:\practice\my-project\node_modules\@ngtools\webpack\src\plugin.js:21:14) at Object.exports.getNonAotConfig (C:\practice\my-project\node_modules\angular-cli\models\webpack-configs\typescript.js:26:13) at new NgCliWebpackConfig (C:\practice\my-project\node_modules\angular-cli\models\webpack-config.js:24:37) at Class.run (C:\practice\my-project\node_modules\angular-cli\tasks\serve.js:31:29) at C:\practice\my-project\node_modules\angular-cli\commands\serve.run.js:22:22 at process._tickCallback (internal/process/next_tick.js:103:7)

I have created the project by follow the link https://vaadin.com/vaadin-documentation-portlet/elements/angular2-polymer/ng-cli-webpack.html

can anyone help to resolve these.

[BorntraegerMarc]

Hi @nunna-suma

We will begin to work on a fix as soon as possible. But to support AoT a lot of changes are necessary. We will keep you updated and if anybody could help us develop please raise your voice here: https://github.com/platosha/angular-polymer/issues/123

I think a fix will be published in a few months the soonest.

[ryalman]

I put the WebComponentsReady listener directly into the main.ts. I tested it by putting a trivial combo-box and it worked.

Replace platformBrowserDynamic().bootstrapModule(AppModule); with the below.

document.addEventListener('WebComponentsReady', () =>{
  platformBrowserDynamic().bootstrapModule(AppModule);
});