Skip to main content

Installation

TreeSpider can be installed with npm or can be included via CDN.

NPM​

npm i treespider

CDN​

You can choose any CDN of your choice but we will be using UNPKG in this doc, it is recommended to include the minified version of both the ES6 and browser bundles.

ES6​

https://unpkg.com/treespider@latest/dist/es/treeSpider.bundle.min.js

CSS​

https://unpkg.com/treespider@latest/dist/css/treeSpider.css

Quick Start​

After installing TreeSpider you can either import it directly into your project or load it through the script tag, and you can either choose to install it through npm or include it directly through CDN

NPM​

If you installed it with NPM import the ES6 and CSS directly like so, it is recommended to import the minified bundle.

ES6 import with bundler​

import TreeSpider from "treespider"

ES6 import with no bundler​

If you installed TreeSpider into a project that has no bundler, move/copy the treespider folder from node_modules to the root of your project, then include TreeSpider like so

import TreeSpider from "/path/to/installation/folder/dist/es/treeSpider.bundle.min.js"

It is important note the es in the path as it contains the ES6 bundles, to load it through the script tag

<!--...-->
<script src="/path/to/treespider/folder/dist/browser/treeSpider.bundle.min.js"></script>

Then use it directly like so

<script>
    const instance1 = new TreeSpider({...})
</script>

CSS​

The TreeSpider CSS file needs to be included, add it to the head of the body like so

<link rel="stylesheet" href="/path/to/treespider/folder/dist/css/treeSpider.css">

CDN​

As the same as loading TreeSpider when installed with NPM, you can import and load TreeSpider directly from the CDN, using UNPKG

ES6​

import TreeSpider from "https://unpkg.com/treespider@latest/dist/es/treeSpider.bundle.min.js"

And you can replace the latest with any version of your choice, you can also load it directly from CDN through the script tag.

Browser​

<script src="https://unpkg.com/treespider@latest/dist/browser/treeSpider.bundle.min.js"></script>

<!-- Then TreeSpider will be available and can be used like -->
<script>
    const instance1 = new TreeSpider({...})
</script>

Also note the es and browser difference in the ES6 import and browser CDN link, next, add the CSS file from CDN.

CSS​

<link rel="stylesheet" href="https://unpkg.com/treespider@latest/dist/css/treeSpider.css">

Next, the basic usage.