Nowa 上手篇（2）- 建立 React Web 項目

本系列文章，不斷更新中...

• Nowa 上手篇（1）- 介紹

• Nowa 上手篇（2）- 建立 React Web 項目

• Nowa 上手篇（3）- 工具使用指南

• Nowa 上手篇（4）巧用命令集

• ...

在看完廢話超多的介紹篇後，歡迎各位看官來到實戰篇，固然沒看介紹也徹底 OK 啦。

這篇文章主要介紹如何使用 Nowa 可視化工具快速建立 web 項目。好了，廢話很少說，捲起袖子，開戰～

一、進入新建頁面

二、選擇合適的模板

官方模板一共有4種，看官能夠選擇與本身實際業務相符合的模板。爲了教程須要，筆者選擇了 nowa-template-uxcore 模板進行演示。

官方模板旁邊對應有 Version 字樣，指的是模板裏面使用的 UI 組件庫的大版本。

若是官方模板太少，用戶能夠添加自定義的模板，之後會有專門的文章講自定義模板。

讓咱們輕輕地點擊 create 按鈕進入下一步。

三、填寫表單信息

每一個模板都會含有一些的必要信息，好比 Path & Npm Registry，Others 是該模板的其餘配置項，好比 uxcore 模板支持單頁和多頁應用與國際化選項。

若是用戶的項目將來會包含私有源的私有模塊的話，源地址最好填寫私有源地址。

若是項目以前已經存在，會彈窗提示用戶是否覆蓋安裝。

確認以後點擊提交。

四、靜靜等待依賴安裝

安裝結束以後，項目會自動導入到左側的項目列表中。

接下來請看視頻演示

完美！一個項目就這麼快就建立成功了，不到一分鐘的時間。

五、運行項目

點擊第一個大圖標 '啓動' 按鈕後，按鈕字樣會變動爲中止。這時候項目已經啓動了，控制檯的 '監聽日誌' 裏面會看到對應的輸出。

再次點擊 '中止' 按鈕，會結束對項目的監聽。

用戶不須要手動點開瀏覽器輸入一大串的地址，工具會幫你作。用戶只要點擊 '訪問' 按鈕，工具會自動打開瀏覽器，而且連接到起始地址。

一個簡單的網頁就出來了。

歡迎各位看官下載體驗。

若是以爲不錯，請到 github 上面點星星。