Quasar-Framework 是一款基於vue.js開發的開源的前端框架, 它能幫助web開發者快速建立以下網站
- 響應式網站
- 漸進式應用
- 手機應用(通過Cordova)
- 跨平臺應用(通過Electron)
Quasar允許開發者在只寫一次程式碼的情況下發布到多個平臺 website, PWA ,Mobile App 和 Electron App 在使用Quasar的時候, 你甚至不需要Hammerjs, Momentjs, 或者Bootstrap, Quasar框架內包含了已經這些東西,你可以很簡單就使用到.
在前面說什麼都是假的,直接上 demo 才是王道
Quasar現在的最新版本是v0.15.x ,比起v0.14.x系列, 是一次很大的升級,它能讓你更輕易的建立一個Hybrid App, 並且和舊版的配置方法有了很大的區別.舊版更類似vue-cli.新版是通過外掛啊的形式新增擴充功能,例如axios 和vue-i18n. component也是按需引用, 可以在quasar.conf.js裡詳細配置
Quasar預設包含了2套皮膚,你可以切換使用,一套是Material Theme,一套是iOS Theme.但是兩套主題區別不是特別大.
Quasar建立App的命令也是如此的簡單
# run development server (with default theme)
$ quasar dev
# run development server with specific theme
$ quasar dev -t mat
$ quasar dev -t ios
# on specific port
$ quasar dev -p 9090
# PWA
$ quasar dev -m pwa
# Mobile App
$ quasar dev -m cordova -T [android|ios] -t [mat|ios]
# Electron App
$ quasar dev -m electron
# with iOS theme...
$ quasar dev -m electron -t ios複製程式碼
# build for production
$ quasar build
# build for production with specific theme
$ quasar build -t mat
$ quasar build -t ios
# PWA
$ quasar build -m pwa
# Mobile App
$ quasar build -m cordova -T [android|ios] -t [mat|ios]
# Electron App
$ quasar build -m electron
# with iOS theme...
$ quasar build -m electron -t ios複製程式碼
比較需要注意的是在開發的時候有個在component 裡經常有一個attribute叫做color.它的意思不是說color code #fff那種東西,而是官方給的一張顏色表,裡面有對應的顏色可以選擇
筆者感覺這個框架包含了我們開發webapp的各種需求, 用來做跨平臺App和Mobile Website都是一個很好的選擇, 方便(懶)
還有一個比較引人注意的地方就是app Visibility這裡.它可以在檢測到App是否被切換至後臺.
在某些場景下(websocket),這個function是個很不錯的東東
而且作者更新也很勤快, Github上的星星數也越來越多了.5000+ now.大家感覺不錯的話可以去star一下.
(和筆者沒有半毛錢關係, 只是感覺開源的好東西需要支援, 而且掘金上基本搜不到這個框架的資料)
還有一點,Quasar現在只有英文文件 (不知道有沒有考慮多語言文件), 英文不好的同學只能硬啃了.
本次 "簡介" 就到這裡, 謝謝觀眾老爺們的觀看~~