Vue-strap

基于 Vue.js 的 Bootstrap 组件

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 ^0.12, test with 0.12.10).
  • 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 alert = VueStrap.alert
</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

  • [ ] Vue.js 1.0 support. (When Vue.js 1.0 stable is released.)
  • [ ] Bootstrap 4 support. (When Bootstrap 4.0 final is released.)
  • [ ] Tests and Travis-CI.
  • [ ] Refactoring Datepicker.
  • [ ] So many things....

License

vue-strap is licensed under The MIT License.

vue-strap

基于 Vue.js 构建的 Bootstrap 组件

该仓库包含一系列基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件。所以不需要 jQuery 和 Bootstrap 的 JavaScript 文件,唯一需要依赖的是:

  • Vue.js (要求版本为 ^0.12,基于 0.12.10 版本做的测试)
  • Bootstrap CSS (需要版本为 3.x.x, 基于 3.3.5 版本做的测试)。 VueStrap 不依赖某个非常精确的 Bootstrap 版本。

安装

NPM

$ npm install vue-strap

CommonJS

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

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

ES6

import alert from 'vue-strap/src/alert'
// 或者
import { alert } from 'vue-strap'

new Vue({
  components: {
    alert
  }
})

AMD

$ bower install vue-strap

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

在浏览器中直接引用

dist 文件夹包含 vue-strap.jsvue-strap.min.js 两个文件,所有模块都导出到了 window.VueStrap 下面,所以可以引用其中的一个文件即可在浏览器中使用。也可以通过 CDNJS 获取。

<script src="path/to/vue.js"></script>
<script src="path/to/vue-strap.js"></script>
<script>
  var alert = VueStrap.alert
</script>

文档

查看 文档 里面可在线编辑的例子。

本地安装(开发环境)

  • 执行 npm install 安装所有依赖
  • 执行 npm run docs 在开发模式下运行文档站点,这会自动监控文件的变化。
  • 执行 npm run build 完成构建

接下来要做

查看 路线图

许可

vue-strap 的许可是 MIT License

讨论区