摘要:接下來會介紹如何使用快速開發(fā)應(yīng)用。但是因為是教程,所以我們點按鈕創(chuàng)建項目。從創(chuàng)建到啟動,不過一分鐘的事情,是不是超級方便快捷呢小特性用戶可以在右側(cè)命令集區(qū)添加自定義命令,所有的命令都一鍵運行,你都不需要打開終端了。
前言吐槽
前端的技術(shù)發(fā)展辣么快,對于前端新手來說,我還沒怎么使用 jQuery 開發(fā)界面就要換成Angular & Vue & React & ... 更復(fù)雜的是,用戶還要學習一堆復(fù)雜的構(gòu)建工具把頁面進行優(yōu)化優(yōu)化再優(yōu)化。
然而很多前端開發(fā)者并不想把時間浪費在構(gòu)建上,希望專注于頁面開發(fā)。那么有沒有一套成熟的解決方案幫助用戶節(jié)省學習成本,快速開發(fā)應(yīng)用呢?
答案當然是有的,如果你是個初學 Webpack 和 React 這一套生態(tài)體系的人,接下來我介紹的這個工具將非常適合你。
主角來臨注意注意了,非常高效快捷的桌面可視化工具 Nowa 誕生了!
Nowa(Not Only for Web App, but also for anything) 是一個跨平臺的可視化 Web 開發(fā)工具,旨在幫助用戶部署環(huán)境,簡化項目的創(chuàng)建、構(gòu)建、開發(fā)以及調(diào)試流程。
Nowa 是為了解決以下痛點:
每次下載或新建項目都要安裝一坨開發(fā)用的依賴,而這些依賴絕大部分都是重復(fù)的,耗時又占空間;
每個項目的構(gòu)建任務(wù)配置在自己項目中維護,不方便統(tǒng)一維護和管理;
構(gòu)建配置對于很多新手用戶來說還是太繁瑣,迫切需要一個一站式的解決方案;
項目模板的更新依賴于腳手架的發(fā)布,頻繁更新用戶體驗不佳;
希望可以在一個地方找到項目工程化常用命令及工具;
它內(nèi)置了一整套 Webpack 構(gòu)建體系,用戶無需安裝成套復(fù)雜的依賴,只需下載安裝即可使用。接下來會介紹如何使用 Nowa 快速開發(fā) React 應(yīng)用。
教程有大圖 創(chuàng)建項目初始化安裝需要一些時間,菊花轉(zhuǎn)完之后會出現(xiàn)簡單的歡迎頁:
用戶可以通過點擊導入按鈕活著拖拽項目導入已有的 Nowa 項目。但是因為是教程,所以我們點Create New Project按鈕創(chuàng)建項目。
選擇模板圖片上提供了三個官方模板,每一個模板對應(yīng)一種react開發(fā)場景,用戶可以選擇適合自己的。
Salt & Antdmobile 模板適合開發(fā) H5 應(yīng)用, Uxcore 模板適合開發(fā) Web 應(yīng)用。官方模板不夠用的話,可以添加自定義模板,如果你有優(yōu)秀的模板拿來秀,請聯(lián)系筆者把它變成官方模板。
我們選擇 Salt 模板進行初次開發(fā)。點擊Create按鈕進入表單填寫的頁面,請選擇適合自己的 Npm 源,內(nèi)陸用戶請選擇 taobao。
點擊提交按鈕之后,分分鐘就下載好依賴了, 飛一般的速度,你值得體驗!
啟動項目依賴安裝結(jié)束之后,頁面自動切換到項目詳情頁。
如果點擊 Start 按鈕,工具就會自動構(gòu)建項目,用戶都不需要寫復(fù)雜的 Webpack 配置,Nowa 幫你實現(xiàn)模塊實時熱替換。
如果點擊了Compile按鈕,工具會自動打包項目到dist文件夾。
從創(chuàng)建到啟動,不過一分鐘的事情,是不是超級方便快捷呢?
小特性用戶可以在右側(cè)命令集區(qū)添加自定義命令,所有的命令都一鍵運行,你都不需要打開終端了。如果覺得英文版看起來別扭,可以在工具設(shè)置里面切換到中文版。
Nowa 還提供人性化的依賴管理的功能,用戶一眼望盡所有需要更新的依賴,一鍵更新所有安裝,簡直不要太爽了!
當然重點是 Nowa 跨平臺而且開源~
Windows
Mac
Linux
如果工具用的舒服,請到 Github上賞星星~
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/82504.html
摘要:上手篇介紹上手篇創(chuàng)建項目上手篇工具使用指南上手篇巧用命令集的意思是,其實筆者第一次接觸到它的時候,還以為是諾娃的意思,可能是紀念開發(fā)者的媳婦兒,開個小玩笑。怎么用請看接下來的上手篇創(chuàng)建項目。 這個專題主要是詳細介紹 Nowa 工具,為此碼字無數(shù)。 Nowa 上手篇(1)- 介紹 Nowa 上手篇(2)- 創(chuàng)建 React Web 項目 Nowa 上手篇(3)- 工具使用指南 Nowa...
摘要:如果項目之前已經(jīng)存在,會彈窗提示用戶是否覆蓋安裝。靜靜等待依賴安裝安裝結(jié)束之后,項目會自動導入到左側(cè)的項目列表中。再次點擊停止按鈕,會結(jié)束對項目的監(jiān)聽。 本系列文章,不斷更新中... Nowa 上手篇(1)- 介紹 Nowa 上手篇(2)- 創(chuàng)建 React Web 項目 Nowa 上手篇(3)- 工具使用指南 Nowa 上手篇(4)巧用命令集 ... 在看完廢話超多的介紹篇后,歡...
摘要:本系列文章,不斷更新中上手篇介紹上手篇創(chuàng)建項目上手篇工具使用指南上手篇巧用命令集這一篇文章主要是工具的使用指南。創(chuàng)建項目請參考上手篇創(chuàng)建項目導入項目請直接把項目文件夾拖入工具,或者點擊項目列表的文件夾圖標。 本系列文章,不斷更新中... Nowa 上手篇(1)- 介紹 Nowa 上手篇(2)- 創(chuàng)建 React Web 項目 Nowa 上手篇(3)- 工具使用指南 Nowa 上手篇(...
摘要:有數(shù)百個免費的庫出來,為應(yīng)用程序選擇正確的框架變得非常困難。是流行的驅(qū)動技術(shù)之一,由于年創(chuàng)建。在這三個塊中,有幾個暴露低層接口的綁定。反應(yīng)由,和許多開發(fā)人員和個人的社區(qū)維護。誕生于年,是一個輕量級的框架。 有數(shù)百個免費的JS庫出來,為應(yīng)用程序選擇正確的JavaScript框架變得非常困難。一些開發(fā)商最終會拋棄,而其他開發(fā)者則迅速發(fā)展,并得到廣泛采用。許多開發(fā)人員只知道像jQuery和R...
摘要:為什么我們需要是一個基于的套件庫,兼容。全面的國際化支持所有組件的內(nèi)置文案支持國際化,大部分文案用戶可以主動設(shè)置。持續(xù)的功能增強借助社區(qū)和團隊自身的力量,會在現(xiàn)有基礎(chǔ)上優(yōu)化使用體驗,增強組件功能,添加更多常用組件來滿足不同場景的需求。 showImg(https://gw.alicdn.com/tps/TB1TVapKFXXXXbbXpXXXXXXXXXX-1000-500.png);...
閱讀 3525·2021-11-24 09:39
閱讀 787·2019-08-30 14:22
閱讀 3038·2019-08-30 13:13
閱讀 2321·2019-08-29 17:06
閱讀 2925·2019-08-29 16:22
閱讀 1262·2019-08-29 10:58
閱讀 2436·2019-08-26 13:47
閱讀 1635·2019-08-26 11:39