什么是快應(yīng)用？?
1. 快應(yīng)用是基于手機(jī)硬件平臺(tái)的新型應(yīng)用形態(tài)，標(biāo)準(zhǔn)是由主流手機(jī)廠商組成的快應(yīng)用聯(lián)盟聯(lián)合制定。?
2. 快應(yīng)用標(biāo)準(zhǔn)的誕生將在研發(fā)接口、能力接入、開(kāi)發(fā)者服務(wù)等層面建設(shè)標(biāo)準(zhǔn)平臺(tái)，以平臺(tái)化的生態(tài)模式對(duì)個(gè)人開(kāi)發(fā)者和企業(yè)開(kāi)發(fā)者全品類(lèi)開(kāi)放。?
3. 快應(yīng)用具備傳統(tǒng)APP完整的應(yīng)用體驗(yàn)，無(wú)需安裝、即點(diǎn)即用。

快應(yīng)用官網(wǎng)：https://www.quickapp.cn/?
開(kāi)發(fā)文檔：https://doc.quickapp.cn/?
開(kāi)發(fā)環(huán)境：windows7

著手開(kāi)發(fā)第一個(gè)快應(yīng)用

1.環(huán)境搭建?
1.1 安裝nodejs：官網(wǎng)上的原話?
?
（在鴻洋大神的文章中找到的網(wǎng)址） 我安裝的是7.0，網(wǎng)址：https://nodejs.org/en/blog/release/v7.0.0/?
按照自己的電腦要求下載相應(yīng)版本，下載后點(diǎn)擊安裝就行。?
1.2 安裝hap-toolkit?
windows：window+R在命令行中，輸入以下命令安裝

npm install -g hap-toolkit

• 1

在命令行中輸入hap -V會(huì)輸出版本信息,如下，類(lèi)似”0.0.26”，表示hap-toolkit安裝成功。

hap -V

• 1

?
2.HelloWorld?
2.1.創(chuàng)建一個(gè)新項(xiàng)目?
選擇或者自己先進(jìn)一個(gè)文件夾，在命令行中輸入：hap init <ProjectName>?
<ProjectName>是你自定義的項(xiàng)目名稱(chēng)?
例如：?
?
然后繼續(xù)輸入你的項(xiàng)目名稱(chēng)，等待創(chuàng)建完成。?
在你剛剛的目錄下，你可以查看它生成的文件，它包含了項(xiàng)目配置與簡(jiǎn)單頁(yè)面初始化代碼：?

src：項(xiàng)目源文件夾node_modules：項(xiàng)目的依賴(lài)類(lèi)庫(kù)sign：簽名模塊，當(dāng)前僅有debug簽名，如果內(nèi)測(cè)上線，請(qǐng)?zhí)砑觬elease文件夾，增加線上簽名；簽名生成方法請(qǐng)參考文檔：編譯工具的openssl

• 1
• 2
• 3
• 4

2.2安裝npm依賴(lài)?
在項(xiàng)目的根目錄（Firsthelloword）下運(yùn)行以下命令，安裝依賴(lài)包（webpack，babel等）：

npm install

• 1

?
2.3編譯項(xiàng)目?
繼續(xù)在根目錄下輸入以下命令進(jìn)行編譯打包，生成rpk包。

npm run build

• 1

編譯打包成功后，項(xiàng)目根目錄下會(huì)生成文件夾：build、dist?
build：臨時(shí)產(chǎn)出，包含編譯后的頁(yè)面js，圖片等?
dist：最終產(chǎn)出，包含rpk文件。其實(shí)是將build目錄下的資源打包壓縮為一個(gè)文件，后綴名為rpk，這個(gè)rpk文件就是項(xiàng)目編譯后的最終產(chǎn)出?
2.3自動(dòng)重新編譯?
如果希望每次修改源代碼文件后，都自動(dòng)重新編譯項(xiàng)目，輸入以下命令：

npm run watch

• 1

注意（我沒(méi)有遇到該錯(cuò)誤）：?
如果報(bào)錯(cuò)遇到Cannot find module ‘…/webpack.config.js’，請(qǐng)重新執(zhí)行一次hap update –force。這是由于高版本的npm在npm install時(shí)，會(huì)校驗(yàn)并刪除了node_modules下部分文件夾，導(dǎo)致報(bào)錯(cuò)。而hap update –force會(huì)重新復(fù)制hap-toolkit文件夾到node_modules中

3.安裝手機(jī)調(diào)試器?
3.1安裝手機(jī)調(diào)試器?
在手機(jī)上安裝一個(gè)apk，地址：https://statres.quickapp.cn/quickapp/quickapp/201803/file/201803200129552999556.apk，下載后安裝至自己手機(jī)上就可以了。?
運(yùn)行效果：?
?
說(shuō)明如下：?
掃碼安裝：配置HTTP服務(wù)器地址，下載rpk包，并喚起平臺(tái)運(yùn)行rpk包?
本地安裝：選擇手機(jī)文件系統(tǒng)中的rpk包，并喚起平臺(tái)運(yùn)行rpk包?
在線更新：重新發(fā)送HTTP請(qǐng)求，更新rpk包，并喚起平臺(tái)運(yùn)行rpk包?
開(kāi)始調(diào)試：喚起平臺(tái)運(yùn)行rpk包，并啟動(dòng)遠(yuǎn)程調(diào)試工具

注意：若無(wú)法正常使用調(diào)試器，請(qǐng)升級(jí)手機(jī)系統(tǒng)到最新版本或安裝平臺(tái)預(yù)覽版

（如果你電腦上安裝了夜神模擬器或者其它，會(huì)自動(dòng)打開(kāi)夜神并且安裝在其上邊，你可以使用adb命令安裝，具體請(qǐng)參考adb命令使用）

adb install -r apk具體路徑

• 1

安裝運(yùn)行后，你會(huì)發(fā)現(xiàn)上邊的按鈕都點(diǎn)不了。What?不用擔(dān)心，繼續(xù)往下看（可以點(diǎn)擊的請(qǐng)?zhí)^(guò)以下步驟）。?
3.2手機(jī)安裝平臺(tái)預(yù)覽版?
點(diǎn)擊以下鏈接下載.apk，安裝至你的手機(jī)上：https://statres.quickapp.cn/quickapp/quickapp/201803/file/201803200129552999556.apk?
安裝后你會(huì)發(fā)現(xiàn)你點(diǎn)開(kāi)它的界面是一片灰色的，但是回到之前的快應(yīng)用調(diào)試器，他的按鈕都可以點(diǎn)擊了喲。?
4.在手機(jī)上運(yùn)行rpk包?
官網(wǎng)上介紹了兩種途徑：?
a. HTTP請(qǐng)求：開(kāi)發(fā)者啟動(dòng)HTTP服務(wù)器，打開(kāi)調(diào)試器，點(diǎn)擊?掃碼安裝?配置HTTP服務(wù)器地址，下載rpk包，并喚起平臺(tái)運(yùn)行rpk包?
b.本地安裝：開(kāi)發(fā)者將rpk包拷貝到手機(jī)文件系統(tǒng)，打開(kāi)調(diào)試器，點(diǎn)擊?本地安裝?選擇rpk包，并喚起平臺(tái)運(yùn)行rpk包

4.1本地安裝：?
使用adb命令將根路徑下的dist文件夾下的rpk文件，如?
?
將它復(fù)制到手機(jī)上，我用的是華為平板，代碼如下：?

adb push 電腦rpk文件目錄 手機(jī)目錄

• 1

接下來(lái)打開(kāi)快應(yīng)用調(diào)試器，點(diǎn)擊本地安裝，找到rpk文件，點(diǎn)擊后打開(kāi)另一個(gè)快應(yīng)用，就會(huì)看到那個(gè)helloword了。?

4.2掃碼安裝：?
第一步：打開(kāi)命令窗口，跳轉(zhuǎn)到項(xiàng)目根目錄，執(zhí)行以下命令（默認(rèn)端口為12306）：

npm run server

• 1

或者自定義端口(如8080)：

npm run server -- --port 8080

• 1

運(yùn)行下來(lái)是這樣的：?

配置HTTP服務(wù)器地址有兩種方式，以下兩者選其一即可：?
第一種：打開(kāi)調(diào)試器 –> 點(diǎn)擊”掃碼安裝”，掃描終端窗口中的二維碼即可完成配置（若掃描不成功，可在瀏覽器中打開(kāi)頁(yè)面：http://localhost:，掃描頁(yè)面中的二維碼）?
第二種：打開(kāi)調(diào)試器 –> 點(diǎn)擊右上角menu –> 設(shè)置，輸入終端窗口中提示的HTTP服務(wù)器地址?
本人用的第一種方法，直接掃描上圖的二維碼不行，然后我在火狐上輸入了：http://localhost:12306?（我沒(méi)改端口號(hào)，默認(rèn)為12306，修改了的用自己修改的端口），生成了一個(gè)二維碼，如下圖，用手機(jī)掃描二維碼就安裝上了。

想要實(shí)時(shí)監(jiān)聽(tīng)：npm run watch;

就這樣，我的第一個(gè)快應(yīng)用就開(kāi)發(fā)完成了。

轉(zhuǎn)載于:https://www.cnblogs.com/lgxin/p/8677291.html

《新程序員》：云原生和全面數(shù)字化實(shí)踐50位技術(shù)專(zhuān)家共同創(chuàng)作，文字、視頻、音頻交互閱讀

總結(jié)

以上是生活随笔為你收集整理的快应用快速入门的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。