飛冰GUI官方使用教程 Iceworks快速開始

零環(huán)境搭建 零配置 簡單易用

Iceworks 是 ICE 推出的輔助開發(fā)者快速開發(fā)中后臺前端應用的 GUI 軟件，目前支持 macOS 和 Windows 兩大平臺。通過 Iceworks 點擊下載按鈕即可。
創(chuàng)建項目
軟件啟動后，項目列表為空，可通過的【創(chuàng)建項目】新建一個項目。

界面會跳轉到模板市場，目前提供三種模板進行選擇，鼠標移動到指定的模板上，點擊【以該模板創(chuàng)建項目】進入項目配置頁面。

新建一個文件夾或者選擇已有的空文件夾（避免覆蓋原有文件）。
給項目起一個項目名，以便后續(xù)識別。
點擊【開始創(chuàng)建項目】即可開始創(chuàng)建
默認會在創(chuàng)建的時候同時安裝項目依賴，時間上會相對久一些，也可取消勾選，后續(xù)自行安裝
管理項目
項目創(chuàng)建完成后，會自動添加到項目列表中，并打開當前項目管理面板。
通過項目管理面板，可執(zhí)行 啟動調(diào)試服務 新建頁面 構建項目 等操作。

啟動調(diào)試服務
點擊 啟動調(diào)試服務 等待完成后出現(xiàn)服務地址，點擊可以預覽當前項目。

上圖是一個 ICE Design CMS 模板啟動后的預覽效果。
新建頁面
啟動調(diào)試服務后，可使用新建頁面來搭建頁面，通過 block 的組合完成頁面的創(chuàng)建。
進入 block 搭建界面

上方列出了當前項目可用的 layout 布局方式，選中任一一個作為新頁面的布局。
下方列出了當前可選擇的 blocks，點擊即可選擇該 block 到已選區(qū)塊列表中。
右側為選中 block 組合的縮略圖預覽。
選擇 layout 以及 block 后，點擊右下角生成頁面，會提示輸入頁面名，路由名，可以定義需要的名稱，
頁面名：表示生成的文件名稱。
路由名：表示頁面的訪問地址，可通過 http://127.0.0.1:4444/#/xxxx 訪問到對應的路由頁面。
示例中，創(chuàng)建了 page16 訪問后即可看到剛搭建的頁面了。

進入開發(fā)調(diào)試
點擊項目版面上的 編輯中打開 會立即使用設置中選擇的編輯器打開項目，目前支持 Visual Studio Code，Sublime Text 3，WebStorm 和 Atom 等編輯器，推薦使用 Visual Studio Code，如果你的電腦中未安裝請先安裝。
項目目錄結構說明：

├── build // 打包資源
├── mock // 模擬數(shù)據(jù)
├── public // 靜態(tài)資源
├── src
│ ├── components // 公共組件
│ ├── config // 公共配置
│ ├── layouts // 通用布局
│ ├── pages // 頁面
│ ├── utils // 通用方法
│ ├── global.scss // 全局樣式
│ ├── index.html // 入口模板
│ ├── index.js // 應用入口
│ └── routes.jsx // 路由入口
├── tests // 測試
├── .editorconfig // 代碼風格配置
├── .eslintignore // eslint 忽略目錄配置
├── .eslintrc // eslint 配置
├── generator.json // generator.json
├── package.json // package.json
├── README.md // 項目說明
└── yarn.lock // 模板版本管理
例如上一步已創(chuàng)建的 Page16 頁面：

通過二次開發(fā)增加業(yè)務邏輯，完成業(yè)務需求。

打包發(fā)布

點擊項目面板上的構建項目按鈕，將開發(fā)的構建出比較終的 js css 等資源。
構建完成后，會在項目目錄下生成 build 文件夾，里面存在了 index.html index.js index.css 文件。使用你熟悉的方式，上傳到對應的 cdn 服務器。

Iceworks 2.15.0 官方64位版

• 軟件性質：國產(chǎn)軟件
• 授權方式：免費版
• 軟件語言：簡體中文
• 軟件大�。�54799 KB
• 下載次數(shù)：322 次
• 更新時間：2019/4/1 22:05:50
• 運行平臺：WinXP,Win7,...
• 軟件描述：飛冰（ICE）是一套基于 React 的中后臺應用解決方案，在阿里巴巴內(nèi)部，已經(jīng)... [立即下載]