NPM packages

DataTables and its extensions are available as NPM packages.

As DataTables supports multiple styling frameworks each of the libraries (DataTables and each of its extensions) are split into separate packages for the library's core software and its styling. The result is that you need to install a package for the library's core software plus a styling package in order for it to function and be styled correctly.

DataTables and its accompanying packages will work natively with both ES modules and CommonJS.

ES module loader

To use DataTables and its extensions in a modern ES module environment, install the package you require (from below) and then include them in your package by using import statements for each package:

import DataTable from 'datatables.net-dt'; import 'datatables.net-buttons-dt'; import 'datatables.net-responsive-dt'; // DataTables initialisation let table - new DataTable('#myTable', { // ... configuration options }); 

Special note for Buttons - only basic buttons are available by default - if you wish to use them all, a couple of extra files need to be loaded in:

import JSZip from 'jszip'; // For Excel export import PDFMake from 'pdfmake'; // For PDF export import 'datatables.net-buttons/js/buttons.html5.mjs'; import 'datatables.net-buttons/js/buttons.print.mjs'; import 'datatables.net-buttons/js/buttons.colVis.mjs'; DataTable.Buttons.jszip(JSZip); DataTable.Buttons.pdfMake(PDFMake); 

CommonJS loader

As well as ES modules, the packages all also support CommonJS loaders (e.g. older versions of WebPack or Node.js). For example:

var $ = require( 'jquery' ); var dt = require( 'datatables.net-dt' ); var buttons = require( 'datatables.net-buttons-dt' ); 

Special note for Buttons - using require('datatables.net-buttons'); will include only the base Buttons library, and not the button definitions (such as column visibility, file exporting and print view). These button definition files can be optionally included using:

const JSZip = require('jszip'); const pdfMake = require('pdfmake); require( 'datatables.net-buttons/js/buttons.colVis.js' ); # Column visibility require( 'datatables.net-buttons/js/buttons.html5.js' ); # HTML 5 file export require( 'datatables.net-buttons/js/buttons.print.js' ); # Print view button 

Window-less environments

For window-less environments (i.e. not in the web-browser) the DataTables CommonJS packages all export a factory function that can be executed with two optional arguments:

1. The window object to use (this is require as jQuery in a headless CommonJS environment can require a window with a document attached). If no parameter is given, or it is falsy, window will be used.
2. The jQuery object that DataTables should be attached to. If no parameter is given, the package will do its own require('jquery') to include jQuery

var $ = require( 'jquery' )( window ); var dt = require( 'datatables.net-dt' )( window, $ ); var buttons = require( 'datatables.net-buttons-dt' )( window, $ ); 

NPM package installation

Select the styling framework that you wish to use from the buttons below:

The following packages can be installed for DataTables core and its extensions:

# DataTables core npm install datatables.net-dt # AutoFill npm install datatables.net-autofill-dt # Buttons npm install datatables.net-buttons-dt # ColReorder npm install datatables.net-colreorder-dt # ColumnControl npm install datatables.net-columncontrol-dt # FixedColumns npm install datatables.net-fixedcolumns-dt # FixedHeader npm install datatables.net-fixedheader-dt # KeyTable npm install datatables.net-keytable-dt # RowGroup npm install datatables.net-rowgroup-dt # RowReorder npm install datatables.net-rowreorder-dt # Responsive npm install datatables.net-responsive-dt # Scroller npm install datatables.net-scroller-dt # SearchBuilder npm install datatables.net-searchbuilder-dt # SearchPanes npm install datatables.net-searchpanes-dt # Select npm install datatables.net-select-dt # StateRestore npm install datatables.net-staterestore-dt