How to use ag-grid with ES6?

Viewed 205

I want to use ag-grid with ES6 modules. I have not been able to find any examples. This is what I have so far:

import { Grid, ClientSideRowModelModule } from "/node_modules/ag-grid-community/dist/ag-grid-community.esm.min.js"
class Index {
    constructor() {
        //grid setup
        this.gridOptions = {
            components: {
                rowModelType: ClientSideRowModelModule
            },
            columnDefs: [
                {headerName: 'id', field: 'id'},
                {headerName: 'serial', field: 'serial'},
            ]
        };

        let eGridDiv = document.querySelector('#grid');
        new Grid(eGridDiv, this.gridOptions);
    }
}

new Index()

But in the console I am getting this error:

AG Grid: could not find matching row model for rowModelType clientSide
AG Grid: Row Model "Client Side" not found. Please ensure the @ag-grid-community/client-side-row-model is registered.';

How exactly do I register the component? A small working example would be a great start.

1 Answers

Change this line:

new Grid(eGridDiv, this.gridOptions);

to this:

new Grid(eGridDiv, this.gridOptions, { modules: [ClientSideRowModelModule] });

few more info

Related