React Data Grid: Upgrading from the Legacy CSS files
The Legacy CSS files are deprecated and will be removed from the Grid in a future major release. The new CSS files are 100% backwards compatible and upgrading should be as simple as changing an import path.
If you upgrade an app from v27 to v29+ without changing the import paths for CSS and Sass (.scss) files then the paths will be invalid and the themes won't work.
Follow the instructions in this document to upgrade.
Updating the CSS import paths
There are many ways to import CSS, but however you are doing this in your app you need to delete the
/dist part from the path. For example if you're using the jsdelivr CDN:
<!-- old path --> <link rel="stylesheet" href="https://email@example.com/dist/styles/ag-grid.css" /> <!-- new path --> <link rel="stylesheet" href="https://firstname.lastname@example.org/styles/ag-grid.css" />
If you are using Grid Modules then you will need to use the new
<!-- old path --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@email@example.com/dist/styles/ag-grid.css" /> <!-- new path --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@firstname.lastname@example.org/ag-grid.css" />
In v27 there were separate CSS files for the light and dark versions of provided themes, e.g.
In v28 both light and dark versions of themes are included in one file, so if you were previously including
ag-theme-alpine-dark.css, change it to
ag-theme-alpine.css. If you were previously including both files, remove the dark file.