• This repository has been archived on 25/May/2018
  • Stars
    star
    4,715
  • Rank 8,974 (Top 0.2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 9 years ago
  • Updated over 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Bootstrap components built with Vue.js

deprecated

SORRY, THIS PROJECT IS NO LONGER MAINTAINED.

There are two great alternatives:

  • bootstrap-vue: BootstrapVue provides one of the most comprehensive implementations of Bootstrap 4 components and grid system for Vue.js and with extensive and automated WAI-ARIA accessibility markup.
  • uiv: Bootstrap 3 components implemented by Vue 2.

vue-strap

Bootstrap components built with Vue.js.

This repository contains a set of native Vue.js components based on Bootstrap's markup and CSS. As a result no dependency on jQuery or Bootstrap's JavaScript is required. The only required dependencies are:

  • Vue.js (required ^v1.x.x, test with v1.0.8).
  • Bootstrap CSS (required 3.x.x, test with 3.3.5). VueStrap doesn't depend on a very precise version of Bootstrap.

Installation

NPM

$ npm install vue-strap

CommonJS

var alert = require('vue-strap/src/alert');
// or
var alert = require('vue-strap').alert;

new Vue({
  components: {
    'alert': alert
  }
})

ES6

import alert from 'vue-strap/src/alert'
// or
import { alert } from 'vue-strap'

new Vue({
  components: {
    alert
  }
})

AMD

$ bower install vue-strap

define(['vue-strap'], function(VueStrap) { var alert = VueStrap.alert; ... });

Browser globals

The dist folder contains vue-strap.js and vue-strap.min.js with all components exported in the window.VueStrap object. These bundles are also available in CDNJS, and on both the Bower and NPM packages.

<script src="path/to/vue.js"></script>
<script src="path/to/vue-strap.js"></script>
<script>
    var vm = new Vue({
        components: {
            alert: VueStrap.alert
        },
        el: "#app",
        data: {
            showRight: false,
            showTop: false
        }
    })
</script>

Docs

See the documentation with live editable examples.

Local Setup

  • Install with npm install
  • Run the docs site in development mode with npm run docs. This will watch for file changes as you work.
  • Build with npm run build.

TODO

See Roadmap

License

vue-strap is licensed under The MIT License.