AoT for datepicker #1093

lifaon74 · 2016-10-06T15:11:35Z

Re-open : #1080

The bug it still there after updating to 1.1.9, please take care to do tests before closing issues, I'll be happy to test it for you if needed. For me it's not an @Hostbinding problem.

Trying to build with ngc (last version installed) :

import { DatepickerModule } from 'ng2-bootstrap';
@NgModule({
  imports: [DatepickerModule],
})
export class MyModule {}

Results in :

dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(24,27): error TS2307: Cannot find module './datepicker-inner.component.ngfactory'.
dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(25,27): error TS2307: Cannot find module './daypicker.component.ngfactory'.
dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(26,27): error TS2307: Cannot find module './monthpicker.component.ngfactory'.
dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(27,27): error TS2307: Cannot find module './yearpicker.component.ngfactory'.
dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(178,18): error TS2341: Property 'datePicker' is private and only accessible within class 'DatePickerComponent'.
dist\tmp\app\node_modules\ng2-bootstrap\components\timepicker\timepicker.component.ngfactory.ts(755,42): error TS2445: Property 'updateHours' is protected and only accessible within class 'TimepickerComponent' and its subclasses.

Seems Datepicker is not AoT ready ;). Hope it will be soon.

The text was updated successfully, but these errors were encountered:

Martin-Luft · 2016-10-06T15:19:48Z

The datePicker property references to the DatePickerInnerComponent. I don't know if you should be allowed to access this property...

The updateHours property I also don't know...

Btw: I don't see the TimepickerModule in your ngModule definition...

@valorkin it's your part :)

lifaon74 · 2016-10-06T15:20:55Z

Maybe, you could take a look at https://github.com/ocombe/ng2-translate where they created a make.js file to create a proper bundles/ folder with ngc.

My datepicker tag :

<datepicker
    [(ngModel)]="date"
    (ngModelChange)="onChangeDatePicker()"
    [showWeeks]="false"
    [startingDay]="1"
></datepicker>

valorkin · 2016-10-07T08:02:39Z

@lifaon74 you don't need bundles

valorkin · 2016-10-07T08:03:40Z

Cannot find module './datepicker-inner.component.ngfactory'.
this is wrong, you should try clean install and build

valorkin · 2016-10-07T08:03:57Z

https://unpkg.com/ng2-bootstrap/components/datepicker/

valorkin · 2016-10-07T08:05:06Z

Property 'datePicker' is private and only accessible within class 'DatePickerComponent'
and it should be private, if AoT requires to make it public it is wrong

valorkin · 2016-10-07T08:06:00Z

updateHours is internal method and should not be exposed too

valorkin · 2016-10-07T08:08:21Z

clean install and build
follow this guide https://github.com/valor-software/ng2-bootstrap/blob/development/docs/getting-started/ng-cli.md
if nothing helped, please reopen and share code sample to reproduce

as for now: internal methods are private as designed

lifaon74 · 2016-10-07T08:33:37Z

@valorkin Why closing issue if not solved ?

Every libs (angular2, ng2-translate, ng2-resource-rest, ng2-component-injector, etc...) have a bundles/ folder with UMD fomat. This is archived by ngc and them use systemjs-builder, not mandatory. It seems you use something different.
Of course I clean and build

Property 'datePicker' is private and only accessible within class 'DatePickerComponent'
and it should be private, if AoT requires to make it public it is wrong

Why not put it public right now waiting for a bug fix, instead of blocking thousand of users ? same for updateHours

All others libs I use supports AoT, only ng2-boostraps resists ;)

Martin-Luft · 2016-10-07T08:39:52Z

Is there an official AoT bug issue or should we create one?

valorkin · 2016-10-07T08:42:53Z

@lifaon74 when I have added system.js bundles there are were no ngc
and system.js had problems with UMD format

Can you imagine miss use of internal methods?

lifaon74 · 2016-10-07T08:49:27Z

ngc comes with @angular/compiler-cli

The bundles are made with "systemjs-builder", I use system-js too and have no problem with ES/UMD, you can have an example here of the config of the systemjs-builder.

valorkin · 2016-10-07T08:51:21Z

ok, updateHours was used in template, made it public
but it is a bit wrong

valorkin · 2016-10-07T08:51:44Z

@Martin-Wegner there are was an issue about and Rob closed it with as designed

valorkin · 2016-10-07T08:52:12Z

@lifaon74 it is good reason to make PR

lifaon74 · 2016-10-07T08:58:30Z

I'll try something this we, but it will probably involve a lot of changes and I dont want to break all of your work.

valorkin · 2016-10-07T09:06:45Z

Just add in parallel, build to bundles2 for example, than I will try with couple of test projects I have and release

Martin-Luft · 2016-10-07T09:12:41Z

@Martin-Wegner there are was an issue about and Rob closed it with as designed

Can you post the link to this issue please?

valorkin · 2016-10-07T09:14:21Z

@Martin-Wegner I am afraid no :(

valorkin · 2016-10-07T09:15:17Z

it seems any property decorator requires public access modifier
not cool

valorkin · 2016-10-07T09:20:29Z

check v 1.1.10

valorkin · 2016-10-07T09:20:59Z

@lifaon74 should be working fine now

lifaon74 · 2016-10-07T09:56:53Z

Hey, good job :

dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(25,27): error TS2307: Cannot find module './daypicker.component.ngfactory'.
dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(26,27): error TS2307: Cannot find module './monthpicker.component.ngfactory'.
dist\tmp\app\node_modules\ng2-bootstrap\components\datepicker\datepicker.component.ngfactory.ts(27,27): error TS2307: Cannot find module './yearpicker.component.ngfactory'.

Did you do something about : /datepicker-inner.component.ngfactory ? It disapeared.

valorkin · 2016-10-07T11:01:19Z

thing is ngfactory never was part of npm module
https://unpkg.com/@angular/[email protected]/

valorkin · 2016-10-07T11:02:06Z

@lifaon74 can you join slack and we will speak about it?

Martin-Luft · 2016-10-07T11:09:45Z

https://ng2.slack.com/messages/ng2-bootstrap/

lifaon74 · 2016-10-07T12:33:06Z

So, I fork it and fix it here : https://github.com/lifaon74/ng2-bootstrap/commit/da5ff0e3f9c88bbc609cbdd990ed7d1746df7fc3

npm run compile

Build pass for ng2-boostrap and personal projects. I'm currently testing if everything works properly.

Please take a look if I forgot something.

valorkin · 2016-10-07T12:41:45Z

Do PR and I will play with it

lifaon74 · 2016-10-07T12:43:49Z

It's not totally ready, I saw you're using a global variable for MouseEvent and Keyboard event and it brokes the execution,, I'll do a PR when it will be ready

lifaon74 · 2016-10-07T13:03:13Z

So I did a PR but dont have currently enouth time to test everything (CI). It builds and works for one of my project right now. I'll continue to test more later.

lifaon74 · 2016-10-07T15:14:33Z

Hum, I changed module es2015 to commonjs, for retrocompatibility.

dhardtke · 2016-10-09T13:57:07Z

I don't know if my issue is related to this one, but I'm also trying to get AOT compilation working. I am using the carousel and I get this:

Error: Error at compiled/app/structure/big-image/big-image.component.ngfactory.ts:20:27: Cannot find module '../../../node_modules/ng2-bootstrap/components/carousel/carousel.component.ngfacto
ry'.
Error at compiled/app/structure/big-image/big-image.component.ngfactory.ts:25:27: Cannot find module '../../../node_modules/ng2-bootstrap/components/carousel/slide.component.ngfactory'.
Error at compiled/app/static/home/home.component.ngfactory.ts:23:27: Cannot find module '../../../node_modules/ng2-bootstrap/components/carousel/carousel.component.ngfactory'.
Error at compiled/app/static/home/home.component.ngfactory.ts:27:27: Cannot find module '../../../node_modules/ng2-bootstrap/components/carousel/slide.component.ngfactory'

dhardtke · 2016-10-09T17:19:57Z

Okay, got it working by using the commonjs plugin:
part of my rollup.js:

commonjs({
    include: ["node_modules/rxjs/**", "node_modules/ng2-bootstrap/**"],
    sourceMap: false
}),

Update:
But it isn't working with webpack. Still trying to figure out why.

Update 2:
Obviously this has nothing to do with neither webpack nor rollup.

Update 3:
Weird. It is working if I place the .ts files from components/carousel in ng2-bootstrap's node_modules/ directory.

dhardtke · 2016-10-10T14:27:05Z

ping @valorkin
Any news on this?
The .ngfactory files will only be generated if the .ts files lie around in ng2-bootstrap's folder in node_modules/

valorkin · 2016-10-10T14:31:15Z

Working on it :(

valorkin · 2016-10-11T11:49:36Z

I will really appreciate if you will try
npm i ng2-bootstrap@beta --save

and try published solution

valorkin · 2016-10-11T11:50:06Z

BTW I am using ng-cli with --aot flag to test
and what are you guys using?

dhardtke · 2016-10-11T12:16:00Z

I can confirm that it is working.
And I'm using webpack with https://github.com/angular/angular-cli/tree/master/packages/webpack

lifaon74 · 2016-10-11T12:24:18Z

Working for me too, thanks for this great feature !

valorkin · 2016-10-11T12:43:10Z

just to have your heads up, when I am done
with bundling stuff
I will publish new datepicker :D

dhardtke · 2016-10-11T16:41:29Z

Well too early to congratulate:
Module not found: Error: Can't resolve '../../../node_modules/ng2-bootstrap/components/carousel/carousel.component.ngfactory' in 'app\static\home'

Could you export the classes from CarouselModule as well?

valorkin · 2016-10-12T08:24:48Z

@dhardtke try to clean install
latest beta version npm i ng2-bootstrap@beta

valorkin · 2016-10-12T08:24:58Z

because it is exported

Martin-Luft · 2016-10-12T11:27:32Z

@dhardtke I will close the issue until your feedback is negative.

dhardtke · 2016-10-12T15:07:04Z

@valorkin:

It works if I clone the repo manually (latest version) and put it in node_modules/.

With npm i ng2-bootstrap@beta it didn't work, same error messages.

dhardtke · 2016-10-12T16:22:33Z

ping @Martin-Wegner

valorkin · 2016-10-12T16:24:43Z

Hm, it is strange

dhardtke · 2016-10-12T18:51:24Z

Okay, I fixed it. First, my npm was behaving weirdly so I had to remove node_modules and install again. But that has nothing to do with why it wasn't working.

Please have a look at this:

// import {CarouselModule} from "ng2-bootstrap/components/carousel/carousel.module";
// import {CollapseModule} from "ng2-bootstrap/components/collapse/collapse.module";
// import {DropdownModule} from "ng2-bootstrap/components/dropdown/dropdown.module";
import {CarouselModule} from "ng2-bootstrap/components/carousel";
import {CollapseModule} from "ng2-bootstrap/components/collapse";
import {DropdownModule} from "ng2-bootstrap/components/dropdown";```

If I was importing the modules like the first, commented statements show, it wouldn't work.
So without "/modulename.module" in the import statements it's working fine with the latest (stable) version.

Thanks again!

valorkin · 2016-10-12T19:04:06Z

Awesome! Seems I need to simplify file structure so no one will repeat your issue

valorkin closed this as completed Oct 7, 2016

Martin-Luft reopened this Oct 7, 2016

valorkin closed this as completed in 0dbbf09 Oct 7, 2016

valorkin reopened this Oct 7, 2016

lifaon74 mentioned this issue Oct 7, 2016

feat(bundle): to UMD format #1098

Closed

valorkin closed this as completed in 6e6be1a Oct 11, 2016

Martin-Luft reopened this Oct 12, 2016

Martin-Luft closed this as completed Oct 12, 2016

arkon mentioned this issue Nov 29, 2016

Cannot find module '../../node_modules/ng2-inline-svg/lib/inline-svg.directive.ngfactory' arkon/ng-inline-svg#13

Closed

AoT for datepicker #1093

AoT for datepicker #1093

Comments

lifaon74 commented Oct 6, 2016 • edited Loading

Martin-Luft commented Oct 6, 2016

lifaon74 commented Oct 6, 2016 • edited Loading

valorkin commented Oct 7, 2016 • edited Loading

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

Martin-Luft commented Oct 7, 2016 • edited Loading

valorkin commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

valorkin commented Oct 7, 2016

Martin-Luft commented Oct 7, 2016 • edited Loading

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

valorkin commented Oct 7, 2016

valorkin commented Oct 7, 2016

Martin-Luft commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

valorkin commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

lifaon74 commented Oct 7, 2016

dhardtke commented Oct 9, 2016

dhardtke commented Oct 9, 2016 • edited Loading

dhardtke commented Oct 10, 2016

valorkin commented Oct 10, 2016

valorkin commented Oct 11, 2016

valorkin commented Oct 11, 2016

dhardtke commented Oct 11, 2016

lifaon74 commented Oct 11, 2016

valorkin commented Oct 11, 2016

dhardtke commented Oct 11, 2016

valorkin commented Oct 12, 2016

valorkin commented Oct 12, 2016

Martin-Luft commented Oct 12, 2016

dhardtke commented Oct 12, 2016 • edited Loading

dhardtke commented Oct 12, 2016

valorkin commented Oct 12, 2016

dhardtke commented Oct 12, 2016

valorkin commented Oct 12, 2016

lifaon74 commented Oct 6, 2016 •

edited

Loading

lifaon74 commented Oct 6, 2016 •

edited

Loading

valorkin commented Oct 7, 2016 •

edited

Loading

Martin-Luft commented Oct 7, 2016 •

edited

Loading

Martin-Luft commented Oct 7, 2016 •

edited

Loading

dhardtke commented Oct 9, 2016 •

edited

Loading

dhardtke commented Oct 12, 2016 •

edited

Loading