CDN Usage

Add Chart.ts to any HTML page with a single script tag:

<script type="module">
import { LineChart } from 'https://cdn.chartts.com/core'

const chart = new LineChart(document.getElementById('chart'), {
  data: [
    { month: 'Jan', revenue: 4000 },
    { month: 'Feb', revenue: 5200 },
    { month: 'Mar', revenue: 4800 },
  ],
  x: 'month',
  y: 'revenue'
})
</script>

Every @chartts package is available on the CDN. Replace the package name in the URL:

https://cdn.chartts.com/core
https://cdn.chartts.com/react
https://cdn.chartts.com/vue
https://cdn.chartts.com/svelte
https://cdn.chartts.com/solid
https://cdn.chartts.com/angular
https://cdn.chartts.com/gl

Pin to a specific version by appending @version:

https://cdn.chartts.com/core@0.1.3

Without a version, the CDN serves the latest release. For production use, always pin your version.

Chart.ts is also available on all major public CDNs:

jsDelivr: https://cdn.jsdelivr.net/npm/@chartts/core/+esm
unpkg: https://unpkg.com/@chartts/core
esm.run: https://esm.run/@chartts/core

These CDNs automatically pull from npm when a new version is published.

Access specific files within a package:

https://cdn.chartts.com/core/dist/index.js
https://cdn.chartts.com/core/dist/index.cjs

The default URL (without subpath) serves the optimized ESM bundle.

Use import maps for cleaner imports in your HTML:

<script type="importmap">
{
  "imports": {
    "@chartts/core": "https://cdn.chartts.com/core"
  }
}
</script>
<script type="module">
import { BarChart } from '@chartts/core'
</script>