模塊化、組合式的前端移動框架：Saber
Saber 是 模塊化、組合式 的前端移動框架。
她是提供了 JavaScript 模塊、CSS 樣式庫 與 開發平臺 的完整前端解決方案。
現在，她最擅長做移動端 SPA (Single Page App) 項目。
用她開發輕應用會是個不錯的主意
示例：
訪問地址：http://startupnews.duapp.com
源碼地址：https://github.com/ecomfe/saber-showcase
二維碼：
JavaScript 模塊
JavaScript 模塊是 edp 下的 AMD Package，通過edp import <package>的方式引入。
他們的特點是：
-
細粒度拆分，每個模塊專注做好自己的事情，項目中按需組合
-
拋開桌面瀏覽器的歷史包袱，只為移動端設計，優先使用原生JavaScript
-
擁抱社區，受益于AMD規范，有眾多可用的模塊資源
| 模塊名 | 模塊說明 | 版本 | 文檔 |
|---|---|---|---|
| saber-ajax | Promise 風格的 Ajax 模塊 | 0.1.3 | 文檔 |
| saber-cookie | Cookie 操作模塊 | 0.1.3 | 文檔 |
| saber-dom | 靜態函數風格的 DOM 工具庫 | 0.4.0 | 文檔 |
| saber-emitter | 事件發射器 | 0.5.0 | 文檔 |
| saber-env | 瀏覽器環境檢測 | 0.4.2 | 文檔 |
| saber-firework | MVP 開發框架，提供完整的 SPA 解決方案 | 0.2.6 | 文檔 |
| saber-geo | 地理位置信息 | 0.1.0 | 文檔 |
| saber-lang | 語言增強模塊 | 0.3.1 | 文檔 |
| saber-matchmedia | 監測 CSS 的 media queries | 0.1.0 | 文檔 |
| saber-promise | Promise/A+ 實現 | 0.1.2 | 文檔 |
| saber-router | hash 路由控制模塊 | 0.2.1 | 文檔 |
| saber-run | 動畫支持模塊 | 0.2.0 | 文檔 |
| saber-scroll | 區域滾動支持模塊 | 0.1.2 | 文檔 |
| saber-storage | 本地存儲模塊 | 0.1.0 | 文檔 |
| saber-tap | 瀏覽器無延遲點擊支持模塊 | 0.1.2 | 文檔 |
| saber-uri | URI 處理模塊 | 0.1.1 | 文檔 |
| saber-viewport | 頁面視口管理，提供頁面轉場功能 | 0.2.9 | 文檔 |
| hammer | 外部模塊，移動端手勢庫 | 1.0.10 | 文檔 |
| etpl | 適合 SPA 應用的模板引擎 | 2.1.0 | 文檔 |
CSS 庫
Saber 的 CSS 樣式庫 提供了基本的 樣式工具庫 與 UI 樣式庫，請根據項目特點按需選用。
他們的特點是：
-
用Autoprefixer處理多數兼容性問題，面向 標準 CSS 開發
-
只在調用時才輸出CSS代碼，避免樣式類污染 HTML 代碼的語義
-
以npm package的形式管理版本，升級方便
rider
基于 Stylus、專注于移動端的 CSS 樣式工具庫。
提供了樣式初始化、順時針簡寫、緩動函數、圖片、排版、單位轉換、形狀、動畫、響應式工具 等功能。
rider-ui
基于rider的 UI 樣式庫，用于快速構建移動應用界面。
Platform
Saber 的 平臺工具（edpx-mobile）是對edp功能的補充。
首次運行edp mobile開頭的命令即會自動安裝edpx-mobile，用法請參考使用教程。
一分鐘入門
安裝 edp
npm install edp -g
新建移動SPA項目
# 第一次使用mobile相關命令會自動安裝edpx-mobile edp mobile init spa
添加模塊
edp mobile add /
修改模版文件
編輯src/index.tpl
啟動測試服務器
edp mobile start
本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！