初探 “快應用” 開發

      今天翻看博客,看到大神鴻洋一篇關於“快應用”的文章,立馬就試着在手機上搜索着試了試,確實挺方便的,體驗也挺好,界面跳轉和加載相對還是很快滴,本着技多不壓身的原則,本小菜也試着搞一搞。下面是我第一次的集成過程分享出來。

        首先是nodejs的安裝過程,NodeJS官網首先點擊進去看到的全是英語,對於我這種英語不及格的小菜來說,一個個字母出來還是可以認識的,但是隻要是兩個以上一起出現就懵逼了。呵呵,不過經過我的不懈努力(瞎猜+亂點)最後還是找到了快應用官網推薦的版本: v6.11.3 LTS。跟着我的步驟來點起來:


    這個是剛進去以後看到的界面,然後點擊NEWS,並滑動到最底端會看到一個Older:


        繼續點擊:我們期待的目標版本出現了:


    好了,可以繼續下一步,點擊你就會看到各個系統下面的安裝文件,因爲我的是Windows64位的,就點擊下載對應的文件,然後運行,點擊下一步,等待。。。,最後點擊finish。好了我們的nodejs就算安裝成功了,也可以在命令行模式測試下看到底安裝成功沒,打開命令行輸入:node -v  如果沒出意外的話,會出現:


    出現這個界面就說明你的nodejs安裝完成了,接下來好像就該安裝官網上面說的hap-toolkit。繼續在命令行輸入:

npm install -g hap-toolkit 運行等待幾秒自動安裝完成,好了再次檢測有木有安裝完成輸入:hap -V (注意這個V大寫哦)


    出現這個界面說明你的hap-toolkit安裝完成啦!好了創建你的第一個“快應用”。首先選一個文件夾來存放你以後的“快應用”,我直接在e盤,創建了一個quickapp文件夾,以後的“快應用”都存放在這個目錄下面。進入正題,在命令行下進入你新建的目錄,比如我的就是進入E:\quickapp目錄下,然後輸入:hap init 你的第一個項目名稱,我看鴻洋大神最外層帶有<>符號,開始我也帶着這個符號,但是提示:命令語法不正確。可能大神用的是mac的原因吧,我這把<>符號去掉,立馬運行成功啦。繼續等待幾秒你會發現你的文件下會出現一堆亂七八糟的文件如下:


    你的有可能沒有build和dist文件,這兩個文件是我通過編譯項目後得到的文件,具體文件的含義參考:


    好了,接下來就是編譯了在命令行下進入到你項目的目錄下輸入:npm install,運行完以後繼續輸入:npm run build,運行完以後就可以在你的項目下生成一個dist文件,並且已經生成了一個rpk文件。有了最後的安裝文件,有木有想過怎麼在手機上安裝測試,有木有,有木有。

    開始我們的安裝表演:首先下載一個快應用調試器,發現進去按鈕不能點擊。別急,再下載一個手機安裝平臺預覽版,再次進入到快應用調試器,發現就可以點擊嘍。再下來就是把我們的rpk文件導入到手機目錄中,這個方法也是很多滴,qq,數據線等等。我這裏使用的是adb將文件導入到手機中,命令行模式進入到你的dist文件,然後輸入:adb push ***.rpk /sdcard/運行繼續等待幾秒,完事兒,打開快應用調試器,點擊本地安裝,找到你本地存儲下拉找到你導入的rpk文件即可。

    還有一種掃碼安裝,這個可以在命令行模式下進入到你項目的目錄,然後輸入:npm run server 如下圖:


    點擊掃碼安裝半天掃描不出來,有木有,這時候你會發現http://localhost:12306,把這個輸入到你的瀏覽器,然後掃描完成。或者在快應用調試器的右上角,設置裏輸入你電腦的ip地址+12306,點擊開始調試也可以進入歡迎頁面:


    好了,大功告成啦。後續再更新自己寫的“快應用”,敬請期待哦微笑

    最後附上快應用開發者文檔的鏈接:https://doc.quickapp.cn/

    快應用官網:https://www.quickapp.cn/


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章