Installation

This guide covers detailed installation steps for various environments and configurations.

Package Installation

Using npm

npm install @vantepo/scheduler

Using Yarn

yarn add @vantepo/scheduler

Using pnpm

pnpm add @vantepo/scheduler

Framework Integration

Vantepo Scheduler is built with Web Components, making it compatible with any framework or vanilla JavaScript.

Vanilla JavaScript / ES Modules

import { Scheduler } from '@vantepo/scheduler';

const scheduler = new Scheduler({
  target: '#app',
  data: myData,
  columns: myColumns,
});

React

import { Scheduler } from '@vantepo/scheduler/react';

function App() {
  return (
    <Scheduler
      data={myData}
      columns={myColumns}
    />
  );
}

Vue

<script setup>
import { Scheduler } from '@vantepo/scheduler/vue';
</script>

<template>
  <Scheduler :data="myData" :columns="myColumns" />
</template>

Angular

import { SchedulerModule } from '@vantepo/scheduler/angular';

@NgModule({
  imports: [SchedulerModule],
})
export class AppModule {}

TypeScript Support

Vantepo includes TypeScript definitions out of the box. No additional packages are required.

import { Scheduler, type SchedulerOptions } from '@vantepo/scheduler';

const options: SchedulerOptions = {
  data: [],
  columns: [],
};

Verify Installation

To verify the installation was successful, create a simple test:

import { version } from '@vantepo/scheduler';
console.log('Vantepo Scheduler version:', version);

You should see the version number logged to the console.