[ANGULAR] integrate in angular version 7

Our powerful JS Calendar component


Post Reply
User avatar
NARESH.RAI
Premium Member
Premium Member
Posts: 41
Joined: Mon Aug 17, 2020 12:33 pm

[ANGULAR] integrate in angular version 7

Post by NARESH.RAI »

Hi,

Checked calendar example which has compiled in angular version 10.
where as my application working on angular version 7.

So it this works with my app ? is this library has backward comparability for older version?

thanks!


User avatar
sergey.maltsev
Core Developer
Core Developer
Posts: 658
Joined: Mon Dec 24, 2018 9:15 am

Re: [ANGULAR] integrate in angular version 7

Post by sergey.maltsev »

Hi!

We suggest to use bundled angular wrappers to use within end-user app.
We already checked building angular wrappers with Angular 10 and they work with older versions of apps like Angular 7.
It is not released yet but we plan to do it for it for 4.0 version or one of the upcoming updates for it.

If you have any specific problems please attach the app you can't build/run and we will check it.


User avatar
NARESH.RAI
Premium Member
Premium Member
Posts: 41
Joined: Mon Aug 17, 2020 12:33 pm

Re: [ANGULAR] integrate in angular version 7

Post by NARESH.RAI »

Tried to include calendar angular 10 version in to my angular 7 app getting namespace errors -> "@angular/core/core"' has no exported member 'ɵɵFactoryDef'."

PFA for more details

Attachments
calendarIssue.PNG
calendarIssue.PNG (43.01 KiB) Viewed 99 times

User avatar
sergey.maltsev
Core Developer
Core Developer
Posts: 658
Joined: Mon Dec 24, 2018 9:15 am

Re: [ANGULAR] integrate in angular version 7

Post by sergey.maltsev »

Hi!

Please remove all node_modules and dist folders in app and _shared folders and rebuild the project.

Code: Select all

npm install
npm run build

User avatar
NARESH.RAI
Premium Member
Premium Member
Posts: 41
Joined: Mon Aug 17, 2020 12:33 pm

Re: [ANGULAR] integrate in angular version 7

Post by NARESH.RAI »

Tried this already but didn't worked for me.

Actually we are building calendar library on angular version 10 which as some imports from angular core where as when we use in our app angular-7 it doesn't get those imports from angular core that's why it throws err's..

As some modules are separated or moved from angular core package to other modules from 7-10 upgrade ..

any other solution ?

Thnaks!


User avatar
saki
Core Developer
Core Developer
Posts: 790
Joined: Thu Mar 30, 2017 9:32 am

Re: [ANGULAR] integrate in angular version 7

Post by saki »

Yes, there are several steps to do to make these versions compatible:

  1. First you need to disable Ivy in the library located in examples/frameworks/npm/angular/projects/calendar folder. The file to change is tsconfig.lib.json. angularCompilerOptions should contain:

    Code: Select all

      "angularCompilerOptions": {
        "enableIvy": false,
  2. In the project, in file tsconfig.base.json add the following item:

    Code: Select all

      "compilerOptions": {
        "skipLibCheck": true,
  3. Rebuild examples/frameworks/npm/angular best with:

    Code: Select all

    rm -rf node_modules package-lock.json dist
    npm i && npm run build
  4. Rebuild project also best with:

    Code: Select all

    rm -rf node_modules package-lock.json dist
    npm i && npm run build

User avatar
NARESH.RAI
Premium Member
Premium Member
Posts: 41
Joined: Mon Aug 17, 2020 12:33 pm

Re: [ANGULAR] integrate in angular version 7

Post by NARESH.RAI »

Tried above solution but still getting same errors..

Attaching my app, in which have added library using - {"enableIvy": false}
Please check and update ASAP.

Thanks!

Attachments
testApp.zip
(15.12 MiB) Downloaded 8 times

User avatar
saki
Core Developer
Core Developer
Posts: 790
Joined: Thu Mar 30, 2017 9:32 am

Re: [ANGULAR] integrate in angular version 7

Post by saki »

"enableIvy":false must be in the npm package sources, not in the application.

The application only needs "skipLibCheck":true.


User avatar
NARESH.RAI
Premium Member
Premium Member
Posts: 41
Joined: Mon Aug 17, 2020 12:33 pm

Re: [ANGULAR] integrate in angular version 7

Post by NARESH.RAI »

Yes, added in same way.
Can u please check attached app for more info.


User avatar
saki
Core Developer
Core Developer
Posts: 790
Joined: Thu Mar 30, 2017 9:32 am

Re: [ANGULAR] integrate in angular version 7

Post by saki »

Yes, there is still some combination of angular config options that prevents it from building and working correctly.

In this case, the easiest will be to copy files from npm source to your directory. The .ts files of interest are located in examples/frameworks/npm/angular/projects/calendar/src/lib.

The most important is calendar.component.ts which is the calendar wrapper and it also needs bryntum-config.ts.

Copy the needed files to your project, import directly from these files and also adjust package.json and remove import of @bryntum/calendar-angular.


Post Reply