Ready to take your JavaScript development to the next level? Meet npm Enterprise - the ultimate in enterprise JavaScript. Learn more »

vuetensils

1.0.3-beta • Public • Published

Vuetensils

🍴 A tasty toolset for Vue.js 🛠

Vuetensils is a collection of Vue components desined to be light weight, accessible, and extensible. It is not a full blown UI library. Instead, it is designed to jump start a project with some of the most common UI solutions, but does not bring with it any opinionated styles. Bring your own styles, and let Vuetensils handle things like a modal popup that is accessible, traps user tab focus, and closes when the escape key is pressed. View on GitHub or NPM.

Benchmarks - How much does a UI library add to the final bundle size?

  • No library: +0kb 🆕
  • Vuetify: +697.7kb 😱
  • Bootstrap-Vue: +365.7kb 😳
  • Bootstrap: +163.7kb 😞
  • Vuetensils: +16.7kb 👌

But size is not the whole story. The Libraries above provide a LOT more features, and if you are going to need all of them, they are excellent options. However, if you don't use all the features, there is a lot of unnecessary bloat. With Vuetensils, you get a tiny collection of functional components, to handle some of the more challenging things, and you add your own presentational components on top.

Getting Started

Install:

npm install vuetensils

Import into your Vue project:

// main.js
import Vue from "vue"
import vuetensils from "vuetensils"
import "vuetensils/dist/vuetensils.min.css"
 
Vue.use(vuetensils)

Alternatively, import just the components you need:

// main.js
import Vue from "vue"
import { VtsModal } from "vuetensils"
 
Vue.use(VtsModal)

Use the components:

// Example.vue
<template>
  <div class="my-component">
    <vts-modal v-model="show"> My modal content</vts-modal>
  </div>
</template>
<script>
  export default {
    data: () => ({
      show: true
    })
  }
</script> 

install

npm i vuetensils

Downloadsweekly downloads

2

version

1.0.3-beta

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability