---
title: Installation
id: installation
slug: /
custom_edit_url: null
---

import Tabs from '@theme/Tabs';
import TabItem from '@theme/TabItem';

## Using the package managers (recommended)
You can easily install InfiniteGrid with package managers like [npm](https://www.npmjs.com/) or [yarn](https://classic.yarnpkg.com/en/)

### npm

<Tabs
  groupId="cfc"
  defaultValue="js"
  values={[
    { label: "JavaScript", value: "js" },
    { label: "React", value: "react" },
    { label: "Vue@2", value: "vue" },
    { label: "Vue@3", value: "vue3" },
    { label: "Angular", value: "angular" },
    { label: "Svelte", value: "svelte" }
  ]}>
  <TabItem value="js">

```shell
npm install @egjs/infinitegrid
```

  </TabItem>
  <TabItem value="react">

```shell
npm install @egjs/react-infinitegrid
```

  </TabItem>
  <TabItem value="vue">

```shell
npm install @egjs/vue-infinitegrid
```

  </TabItem>
  <TabItem value="vue3">

```shell
npm install @egjs/vue3-infinitegrid
```

  </TabItem>
  <TabItem value="angular">

```shell
npm install @egjs/ngx-infinitegrid
```

  </TabItem>
  <TabItem value="svelte">

```shell
npm install @egjs/svelte-infinitegrid
```

  </TabItem>
</Tabs>

### yarn
<Tabs
  groupId="cfc"
  defaultValue="js"
  values={[
    { label: "JavaScript", value: "js" },
    { label: "React", value: "react" },
    { label: "Vue@2", value: "vue" },
    { label: "Vue@3", value: "vue3" },
    { label: "Angular", value: "angular" },
    { label: "Svelte", value: "svelte" }
  ]}>
  <TabItem value="js">

```shell
yarn add @egjs/infinitegrid
```

  </TabItem>
  <TabItem value="react">

```shell
yarn add @egjs/react-infinitegrid
```

  </TabItem>
  <TabItem value="vue">

```shell
yarn add @egjs/vue-infinitegrid
```

  </TabItem>
  <TabItem value="vue3">

```shell
yarn add @egjs/vue3-infinitegrid
```

  </TabItem>
  <TabItem value="angular">

```shell
yarn add @egjs/ngx-infinitegrid
```

  </TabItem>
  <TabItem value="svelte">

```shell
yarn add @egjs/svelte-infinitegrid
```

  </TabItem>
</Tabs>

## CDN Links
### packaged(with dependencies)
```html
<!-- unpkg -->
<script src="https://unpkg.com/@egjs/flicking/dist/flicking.pkgd.min.js" crossorigin="anonymous"></script>
<!-- cdnjs -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/egjs-infinitegrid/4.x.x/flicking.pkgd.min.js" crossorigin="anonymous"></script>
```
