Forums Ignite UI for jQuery
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Tory Eneboe
620
Trouble building when using Ignite UI w/ Angular 4 CLI
posted

I am having build issues when using the Ignite UI w/ an Angular 4 app that I created using the Angular CLI.  Here are the steps to reproduce the issue I'm seeing.  These steps assume that you have npm and the angular CLI installed.

1) Using the Angular CLI, create a test app:

     ng new ignite-sample

2) Install this package.

     npm install enhanced-resolve@3.3.0 --save

3) Verify that the build is successful.

     ng build --prod

4) Install the IgniteUI packages

     npm install ignite-ui --save
     npm install igniteui-angular2 --save

5) Add the following imports to update app.module.ts:

     import { IgGridComponent} from 'igniteui-angular2';
     import { IgComboComponent} from 'igniteui-angular2';
     import { IgSplitterComponent} from 'igniteui-angular2';
6) Add the following to the declarations section of app.module.ts:
     IgGridComponent,
     IgComboComponent,
     IgSplitterComponent

7) Run the build again.

     ng build --prod

The build will fail with this error:

ERROR in Type IgGridComponent in C:/temp/ignite-sample/node_modules/igniteui-angular2/index.d.ts is part of the declarations of 2 modules: IgniteUIModule in C:/temp/ignite-sample/node_modules/igniteui-angular2/index.d.ts and AppModule in C:/temp/ignite-sample/src/app/app.module.ts! Please consider moving IgGridComponent in C:/temp/ignite-sample/node_modules/igniteui-angular2/index.d.ts to a higher module that imports IgniteUIModule in C:/temp/ignite-sample/node_modules/igniteui-angular2/index.d.ts and AppModule in C:/temp/ignite-sample/src/app/app.module.ts. You can also create a new NgModule that exports and includes IgGridComponent in C:/temp/ignite-sample/node_modules/igniteui-angular2/index.d.ts then import that NgModule in IgniteUIModule in C:/temp/ignite-sample/node_modules/igniteui-angular2/index.d.ts and AppModule in C:/temp/ignite-sample/src/app/app.module.ts.

I have attached a zipped project.  To reproduce the issue, run these steps:

1) npm install       (to re-hydrate the modules)

2) ng build --prod

Any help that you can provide would be appreciated.

ignite-sample.zip
Parents
  • 23953
    Offline posted

    Hello Tory,

    Thank you for the detailed explanation of your issue. I appreciate it.

    To start with I want to clarify that the command:

    `npm install ignite-ui --save`

    will install Ignite UI OSS which doesn't contain Grids and Data Visualization controls. What you need to do in order to use the Grids is to copy the licensed Ignite UI source code in a folder in your project and reference it from there.

    Looking at the compile error I suggest you to remove the Infragistics components from the declaration section of the "app.module.ts" file and instead import the "IgniteUIModule".

    I'm attaching a new project setup with the Ignite UI grid. Unfortunately it throws an error when I try to compile it using `ng build --prod`, but it should work with `ng serve`. I'm looking into the issue and will update you with my progress.

    Best regards,
    Martin Pavlov
    Infragistics, Inc.

    igniteui-angular-starter.zip
Reply Children