Iceworks(飛冰 GUI)是一款非常好用且功能強(qiáng)大的圖形化界面的開發(fā)平臺(tái)，它承載了ICE的物料體系和開發(fā)體驗(yàn)，飛冰(ICE)是一套基于React的中后臺(tái)應(yīng)用解決方案，在阿里巴巴內(nèi)部，已經(jīng)有270多個(gè)來自幾乎所有BU的項(xiàng)目在使用，歡迎有需要此款工具的朋友們前來下載使用。

Iceworks(飛冰 GUI) v2.20.0 官方安裝免費(fèi)版

• 類型：編程工具
• 大?。?/span>71.8MB
• 語言：簡(jiǎn)體中文
• 時(shí)間：2019-05-18

查看詳情

安裝破解教程

1、在本站下載并解壓，雙擊Iceworks-setup-2.12.0.exe運(yùn)行，如圖所示,稍等一會(huì)兒

2、安裝完成，軟件自動(dòng)運(yùn)行，界面如圖所示使用方法

　　Iceworks 快速開始

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

　　Iceworks 是 ICE 推出的輔助開發(fā)者快速開發(fā)中后臺(tái)前端應(yīng)用的 GUI 軟件，目前支持 macOS 和 Windows 兩大平臺(tái)。通過 Iceworks 點(diǎn)擊下載按鈕即可。

　　創(chuàng)建項(xiàng)目

　　軟件啟動(dòng)后，項(xiàng)目列表為空，可通過的【創(chuàng)建項(xiàng)目】新建一個(gè)項(xiàng)目。

　　界面會(huì)跳轉(zhuǎn)到模板市場(chǎng)，目前提供三種模板進(jìn)行選擇，鼠標(biāo)移動(dòng)到指定的模板上，點(diǎn)擊【以該模板創(chuàng)建項(xiàng)目】進(jìn)入項(xiàng)目配置頁面。

　　新建一個(gè)文件夾或者選擇已有的空文件夾（避免覆蓋原有文件）。

　　給項(xiàng)目起一個(gè)項(xiàng)目名，以便后續(xù)識(shí)別。

　　點(diǎn)擊【開始創(chuàng)建項(xiàng)目】即可開始創(chuàng)建

　　默認(rèn)會(huì)在創(chuàng)建的時(shí)候同時(shí)安裝項(xiàng)目依賴，時(shí)間上會(huì)相對(duì)久一些，也可取消勾選，后續(xù)自行安裝

　　管理項(xiàng)目

　　項(xiàng)目創(chuàng)建完成后，會(huì)自動(dòng)添加到項(xiàng)目列表中，并打開當(dāng)前項(xiàng)目管理面板。

　　通過項(xiàng)目管理面板，可執(zhí)行 啟動(dòng)調(diào)試服務(wù) 新建頁面 構(gòu)建項(xiàng)目 等操作。

　　啟動(dòng)調(diào)試服務(wù)

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

　　上圖是一個(gè) ICE Design CMS 模板啟動(dòng)后的預(yù)覽效果。

　　新建頁面

　　啟動(dòng)調(diào)試服務(wù)后，可使用新建頁面來搭建頁面，通過 block 的組合完成頁面的創(chuàng)建。

　　進(jìn)入 block 搭建界面

　　上方列出了當(dāng)前項(xiàng)目可用的 layout 布局方式，選中任一一個(gè)作為新頁面的布局。

　　下方列出了當(dāng)前可選擇的 blocks, 點(diǎn)擊即可選擇該 block 到已選區(qū)塊列表中。

　　右側(cè)為選中 block 組合的縮略圖預(yù)覽。

　　選擇 layout 以及 block 后，點(diǎn)擊右下角生成頁面，會(huì)提示輸入頁面名，路由名，可以定義需要的名稱，

　　頁面名：表示生成的文件名稱。

　　路由名：表示頁面的訪問地址，可通過 http://127.0.0.1:4444/#/xxxx 訪問到對(duì)應(yīng)的路由頁面。

　　示例中，創(chuàng)建了 page16 訪問后即可看到剛搭建的頁面了。

　　進(jìn)入開發(fā)調(diào)試

　　點(diǎn)擊項(xiàng)目版面上的 編輯中打開 會(huì)立即使用設(shè)置中選擇的編輯器打開項(xiàng)目，目前支持 Visual Studio Code，Sublime Text 3，WebStorm 和 Atom 等編輯器，推薦使用 Visual Studio Code，如果你的電腦中未安裝請(qǐng)先安裝。

　　項(xiàng)目目錄結(jié)構(gòu)說明：

　　例如上一步已創(chuàng)建的 Page16 頁面：

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

　　打包發(fā)布

　　點(diǎn)擊項(xiàng)目面板上的構(gòu)建項(xiàng)目按鈕，將開發(fā)的構(gòu)建出最終的 js css 等資源。

　　構(gòu)建完成后，會(huì)在項(xiàng)目目錄下生成 build 文件夾，里面存在了 index.html index.js index.css 文件。使用你熟悉的方式，上傳到對(duì)應(yīng)的 cdn 服務(wù)器。

　　部署上線

　　上線過程即發(fā)布 HTML 文件的過程，index.html 文件存在在 build 目錄中，將 index.html 文件復(fù)制到對(duì)應(yīng)的服務(wù)服務(wù)器，并修改 html 源碼中的 /build/index.css 和 /build/index.js 地址，是上一步中得到的 cdn 地址以及站點(diǎn)標(biāo)題。

　　一個(gè)標(biāo)準(zhǔn)的 HTML 文件如下所示：

　　在線上環(huán)境我們強(qiáng)烈推薦使用 production 版本的 React，而不是 development 版本。它們之間的區(qū)別除了體積之外，還包括一些針對(duì)線上環(huán)境的性能優(yōu)化。

　　到這里你已經(jīng)學(xué)會(huì)使用 Iceworks 創(chuàng)建一個(gè)項(xiàng)目并發(fā)布：）

更新日志

　　特性：ICELAND 可視化區(qū)塊搭建 Beta 版本發(fā)布，一鍵生成代碼，直觀簡(jiǎn)單

　　修復(fù)：向已有頁面添加區(qū)塊的彈窗的樣式問題

　　修復(fù)：導(dǎo)航頁面創(chuàng)建項(xiàng)目彈窗的樣式問題

　　修復(fù)：無項(xiàng)目時(shí),改變窗口大小產(chǎn)生的報(bào)錯(cuò)

最新評(píng)論