Vuespins NPM | npm.io

Installation

Demo

Browse components and explore their props with Docs

Prerequisites

Quick Start

To install it, open up your terminal and run

npm install vuespins
# or yarn - whichever you prefer
yarn add vuespins

Usage

Browser

<!-- Include after Vue -->
<!-- Local files -->
<script src="/node_modules/vuespins/dist/vuespins.min.js"></script>

<!-- CDN -->
<script src="https://unpkg.com/vuespins@latest/dist/vuespins.min.js"></script>

Bundler (Webpack, Rollup)

import Vue from 'vue'
import Vuespins from 'vuespins'

Vue.use(Vuespins)

How to use it?

After above steps, simply use any spinners in your Vue components

<template>
  <div>
    // Basic Ring Spinner
    <Ring />

    // Custom Ring Spinner
    <Ring
      color="custom color"
      :size="custom size"
      :thickness="custom thickness"
    />
  </div>
</template>

Or you can import any spinner to your liking

<template>
  <div>
    // Basic Ring Spinner
    <CubeGrid />

    // Custom Ring Spinner
    <CubeGrid color="custom color" :size="custom size" />
  </div>
</template>
<script>
import { CubeGrid } from 'vuespins'

export default {
  name: 'app',
  components: {
    CubeGrid
  }
}
</script>