Installation

Installation Sources

There are a number of ways you can include the Tabulator source in your project.

Bower Installation

To get Tabulator via the Bower package manager, open a terminal in your project directory and run the following command:

bower install tabulator --save

NPM Installation

To get Tabulator via the NPM package manager, open a terminal in your project directory and run the following command:

npm install tabulator-tables --save

You can then add the library to your project in one of two ways:

Common JS Require

Either by using a require statment (Common in node.js)

var Tabulator = require('tabulator-tables');

ESM Import

Or by using an import statment (introduced in ES2015)

import Tabulator from 'tabulator-tables';

Yarn Installation

To get Tabulator via the yarn package manager, open a terminal in your project directory and run the following command:

yarn add tabulator-tables 

You can then add the library to your project in one of two ways:

Common JS Require

Either by using a require statment (Common in node.js)

var Tabulator = require('tabulator-tables');

ESM Import

Or by using an import statment (introduced in ES2015)

import Tabulator from 'tabulator-tables';

Git Clone

If you use the Git CVS you can clone the repository directly to your computer with the following terminal command:

git clone https://github.com/olifolkerd/tabulator.git

Download

You can download the source as a zip file from here.

CDN - UNPKG

To access Tabulator directly from the UNPKG CDN servers, include the following two lines at the start of your project, instead of the locally hosted versions:

<link href="https://unpkg.com/tabulator-tables@4.9.1/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.9.1/dist/js/tabulator.min.js"></script>

Latest Version Tracking

If you want your code to track the latest version of Tabulator, then use the following lines of code, when a new version of Tabulator is released it will automatically be available on these links:

<link href="https://unpkg.com/tabulator-tables/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables/dist/js/tabulator.min.js"></script>

ESM Import

If your environment supports ESM module importing then you can also import the module directly from the CDN

import Tabulator from 'https://unpkg.com/tabulator-tables@4.9.1/dist/js/tabulator.es2015.min.js';

Setup Options

Tabulator comes with a range of possible distributions to best suit the needs of your project.

Full Package

Tabulator comes with two full package files, these contain the core Tabulator library and all of the modules bundled into one easy to use package.

Minified

<link href="dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="dist/js/tabulator.min.js"></script>

Unminified

<link href="dist/css/tabulator.css" rel="stylesheet">
<script type="text/javascript" src="dist/js/tabulator.js"></script>

Core JS With Extensions

The core js files provide the minimal JavaScript needed to create a basic table, these are perfect for environments where optimal file sizes are needed.

Minified

<script type="text/javascript" src="dist/js/tabulator_core.min.js"></script>

Unminified

<script type="text/javascript" src="dist/js/tabulator_core.js"></script>

If you need any of the modules in addition to the core files (for example you want to include formatters with your table), then you should include these files after the core js file. The module distributions can be found in the /dist/js/modules folder.

<script type="text/javascript" src="dist/js/tabulator_core.min.js"></script>
<script type="text/javascript" src="dist/js/modules/format.min.js"></script>

jQuery Wrapper

If you want to instantiate Tabulator as a jQuery widget (eg. if you are upgrading from v3.x and don't want to switch to using vanilla js) you will need to include the jquery wrapper file after your tabulator js file

<script type="text/javascript" src="dist/js/tabulator.min.js"></script>
<script type="text/javascript" src="dist/js/jquery_wrapper.min.js"></script>

Custom Build

You can also build your own custom distribution of Tabulator using the gulp task automation tool.

Checkout the Build Documentation for full details.