Vue Kinesis

Appearance

Getting Started ​

Installation ​

So easy to install, just run the following command:

sh
$ npm i @letstri/kinesis
$ npm i @letstri/kinesis
sh
$ pnpm i @letstri/kinesis
$ pnpm i @letstri/kinesis
sh
$ yarn add @letstri/kinesis
$ yarn add @letstri/kinesis
sh
$ bun i @letstri/kinesis
$ bun i @letstri/kinesis

Setup ​

So easy to setup, just run the following command:

js
// src/main.js
import { createApp } from 'vue';
import { kinesisPlugin } from '@letstri/kinesis';

const app = createApp(App);

app.use(kinesisPlugin);
// src/main.js
import { createApp } from 'vue';
import { kinesisPlugin } from '@letstri/kinesis';

const app = createApp(App);

app.use(kinesisPlugin);
js
// plugins/kinesis.js
import { kinesisPlugin } from '@letstri/kinesis';

export default defineNuxtPlugin(({ vueApp }) => {
  vueApp.use(kinesisPlugin);
});
// plugins/kinesis.js
import { kinesisPlugin } from '@letstri/kinesis';

export default defineNuxtPlugin(({ vueApp }) => {
  vueApp.use(kinesisPlugin);
});

Usage ​

TIP

KinesisContainer is a wrapper for KinesisElement components. You should use it to wrap all KinesisElement components.

And, finally, you can use it in your project:

vue
<template>
  <KinesisContainer>
    <KinesisElement>1</KinesisElement>
    <KinesisElement>2</KinesisElement>
    <KinesisElement>3</KinesisElement>
  </KinesisContainer>
</template>
<template>
  <KinesisContainer>
    <KinesisElement>1</KinesisElement>
    <KinesisElement>2</KinesisElement>
    <KinesisElement>3</KinesisElement>
  </KinesisContainer>
</template>