Vue.js開源：Rubik UI - Material Design 風格的輕量組件庫

RodneyLittl 7年前發布 | 36K 次閱讀 Vue.js Vue.js開發 Material Design

關于

Rubik UI 是一個基于 Vue.js 2.0+ 的開源 UI 組件庫，在交互和視覺設計上遵循 Material Design 規范，適用于 PC 端和 mobile 端。

這是個從 jQuery 版本的 Material Design UI 組件庫改版而來，內部系統已經開始使用，開源版本還在開發完善中。

GitHub

https://github.com/ccforward/rubik

NPM

兼容

支持 Vue.js 2.0+，不支持 Vue.js 1.x

Demo

https://ccforward.github.io/rubik/

使用

npm 安裝

$ npm install i-rubik --save


$ yarn add i-rubik</code></pre> 
  
Rubik 初始化
 
  
import Vue from 'vue'
import Rubik from 'i-rubik'
Vue.use(Rubik)


export default {
  name: 'app',
  mounted(){
    this.$rubik.init()
  }
}</code></pre> 
  
引入字體
 
  
<link  rel="stylesheet" type="text/css">
 
  
引入css
 
  
<link href="./node_modules/i-rubik/dist/rubik.min.css" rel="stylesheet" type="text/css">
 
  
相關開源項目
 
  
Rubik UI 的部分組件和樣式代碼參考了以下項目
 
  
在此表示感謝
 
   
  
 
 
  
 
 本文由用戶 RodneyLittl 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！