In the documentation there is a reference how to build standalone grid:
// home.component.ts
import { IGX_GRID_DIRECTIVES } from 'igniteui-angular';// import { IGX_GRID_DIRECTIVES } from '@infragistics/igniteui-angular'; for licensed package
@Component({ selector: 'app-home', template: '<igx-grid [data]="localData" [autoGenerate]="true"></igx-grid>', styleUrls: ['home.component.scss'], standalone: true, imports: [IGX_GRID_DIRECTIVES] /* or imports: [IgxGridComponent] */})export class HomeComponent { public data: Product [];}
But I wasn't being able to find stackblitz project with example that can be run specifically as standalone module. neither I can find references to the files used in the sample .. Can you provide me with either sample project of igx-grid as standalone component or reference where I can find it.
Thanks.
Hello Michael,
Thank you for posting in our community!
I have been looking into your question and the easiest way to generate a standalone component that uses IgxGrid is by using our Ignite UI CLI.
I believe that you will find the following topic quite helpful on the matter:
Getting Started with Ignite UI CLI
Step-by-Step Guide using Ignite UI CLI
Component Templates
Additionally, attached could be found a small sample demonstrating a standalone IgxGrid with a few features enabled. The attached sample is generated with the help of the Ignite UI CLI and by following the step-by-step guide.
Please check out the provided resources and sample and let me know if you need any further information on the matter.
Sincerely, Riva Ivanova Associate Software Developer
3678.standalone-grid.zip
Hello, the project that you provided worked. Thanks
On the other hand I tried to create project with the basic grid as you suggested but it failed .. when I tried to run it :
When I deleted node_modules and tried to rebuild it I've got errors .. I tried to sent you that project with deleted node_modules.. but seems upload does not accept ZIP files .. How can I send it -- should I go to the dedicated support page ? Please let me know .. I need to figure out how to created grids and other components components by using ig new ...
C:\_ngIG\igGridSO>npm installnpm ERR! code ERESOLVEnpm ERR! ERESOLVE could not resolvenpm ERR!npm ERR! While resolving: @angular/compiler@17.0.9npm ERR! Found: @angular/core@17.2.2npm ERR! node_modules/@angular/corenpm ERR! @angular/core@"^17.0.0" from the root projectnpm ERR! peer @angular/core@"17.2.2" from @angular/animations@17.2.2npm ERR! node_modules/@angular/animationsnpm ERR! @angular/animations@"^17.0.0" from the root projectnpm ERR! peerOptional @angular/animations@"17.2.2" from @angular/platform-browser@17.2.2npm ERR! node_modules/@angular/platform-browsernpm ERR! @angular/platform-browser@"^17.0.0" from the root projectnpm ERR! 3 more (@angular/forms, @angular/platform-browser-dynamic, @angular/router)npm ERR! 1 more (igniteui-angular)npm ERR! 6 more (@angular/common, @angular/forms, ...)npm ERR!npm ERR! Could not resolve dependency:npm ERR! peerOptional @angular/core@"17.0.9" from @angular/compiler@17.0.9npm ERR! node_modules/@angular/compilernpm ERR! @angular/compiler@"^17.0.0" from the root projectnpm ERR! peer @angular/compiler@"17.0.9" from @angular/compiler-cli@17.0.9npm ERR! node_modules/@angular/compiler-clinpm ERR! dev @angular/compiler-cli@"~17.0.0" from the root projectnpm ERR! 2 more (@angular-devkit/build-angular, @ngtools/webpack)npm ERR!npm ERR! Conflicting peer dependency: @angular/core@17.0.9npm ERR! node_modules/@angular/corenpm ERR! peerOptional @angular/core@"17.0.9" from @angular/compiler@17.0.9npm ERR! node_modules/@angular/compilernpm ERR! @angular/compiler@"^17.0.0" from the root projectnpm ERR! peer @angular/compiler@"17.0.9" from @angular/compiler-cli@17.0.9npm ERR! node_modules/@angular/compiler-clinpm ERR! dev @angular/compiler-cli@"~17.0.0" from the root projectnpm ERR! 2 more (@angular-devkit/build-angular, @ngtools/webpack)npm ERR!npm ERR! Fix the upstream dependency conflict, or retrynpm ERR! this command with --force or --legacy-peer-depsnpm ERR! to accept an incorrect (and potentially broken) dependency resolution.npm ERR!npm ERR!npm ERR! For a full report see:npm ERR! C:\Users\gkheysin\AppData\Local\npm-cache\_logs\2024-02-22T17_08_34_971Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in: C:\Users\gkheysin\AppData\Local\npm-cache\_logs\2024-02-22T17_08_34_971Z-debug-0.log