自我總結react-native的常見命令及自己所見錯誤

一、Application has not been registered和Could not connect to development sever

? 這兩個錯誤都是指你的項目未與react-native的服務器鏈接上

? 1、 一種在夜神模擬器上調試的方法:

? ? 解決方法有兩種,一種重新運行你的項目,在cmd里在你項目的路徑下輸入命令react-native run-android;另一種是新開一個cmd還是在當前項目路徑下使用命令 react-native start或者npm start,開啟react-native服務器,再reload刷新一下即可,最后結果就如下圖所示啦,成功可以重新實時刷新修改項目的頁面內容啦~用哪種方式看個人喜好咯



2、一種真機上調試的方法:

啰嗦一下

真機調試的方法是?

第一步:打開手機的開發者模式,當然每個機型的打開開發者的方式不同,具體度娘一下就知道啦~

第二步:手機用數據線和電腦鏈接上,還是老規據,在cmd里輸入adb devices,如顯示圖下所示的樣式,即表示真機已連接上啦~

注:如果你中途離開,拔掉了你的手機,也不用擔心得重新react-native run-android,又得百無聊賴的等好久,你可以使用命令在cmd里是使用命令adb reverse tcp:8081 tcp:8081,即可重新鏈接上重新實時刷新調試

如果在真機上也遇見上面類似的問題,也可以使用上面的老套路:

重新運行你的項目,在cmd里在你項目的路徑下輸入命令react-native run-android;或者是新開一個cmd還是在當前項目路徑下使用命令 react-native start或者npm start,開啟react-native服務器

二、如果你也出現了像下圖中的500錯誤,那你就得好好檢查你的語法或者別的。??

如果你添加圖片的話,你得好好檢查一下你的文件路徑有沒有出錯,樣式格式有沒有寫錯;

如果你項目入口路徑,注意看下你的書寫格式有沒有錯誤,得一一對應,如下圖所示:

注:500錯誤一般要看node.js里的圖文界面,看報錯具體在哪一行~

三、app:processDebugResources'.

報錯信息為:

Error:Execution failed for task ':app:processDebugResources'.

> java.io.IOException: Could not delete path 'XXXXXX\XXXXX\ProjectName\android\app\build\generated\source\r\debug\android'.

build文件無法刪除導致的,

解決辦法:

進入項目文件夾下手動刪除android\app\build文件夾內的所有文件后再次運行,這是由于插件重新加載會需要刪除build里的東西,但是好像不知道為什么老是會刪除失敗,就需要我們手動刪除啦~,一般用windows環境會出現的問題,不一定是全部~

四、有些時候覺得自己的node_modules有問題

你可以在項目里打開cmd,使用命令rm -fr node_modules/,就可以刪除npm環境

你可以在項目里打開cmd,使用命令npm i,可以安裝npm環境

這樣你就可以有全新的npm環境啦~

五、最近在用node.js里的websocket,它的簡單小栗子~

首先你得在你新建一個空項目:

安裝node的websocket,命令是如下兩個,同樣在cmd里運行,同樣是在項目文件下

npm i express -S

npm i ws -S

服務端代碼:


客戶端:

<!DOCTYPE html>

<html>

<head>

? ? <meta charset="utf-8" />

? ? <script>

? ? ? ? ?let ws=new WebSocket('ws://localhost:9999');

? ? ? ? var sendMessage = "";

? ? ? ? // onopen是客戶端與服務端建立連接后觸發

? ? ? ? var video = document.getElementById("videoSource");

? ? ? ? var startV = document.getElementById("startV");

? ? ? ? var pauseV = document.getElementById("pauseV");

? ? ? ? var endV = document.getElementById("endV");

? ? ? ? ws.onopen = function () {

? ? ? ? ? ? //ws.send('哎呦,不錯哦');

? ? ? ? ? ? // ws.send("video");

? ? ? ? };

? ? ? ? // onmessage是當服務端給客戶端發來消息的時候觸發

? ? ? ? ws.onmessage = function (res) {

? ? ? ? ? ? console.log(res); // 打印的是MessageEvent對象

? ? ? ? ? ? // 真正的消息數據是 res.data

? ? ? ? ? ? console.log(res.data);

? ? ? ? ? ? // setMessageInnerHTML(res.data);

? ? ? ? ? ? // videoPlay();

? ? ? ? ? ? if (res.data == "video") {

? ? ? ? ? ? ? ? document.getElementById("videoSource").play();

? ? ? ? ? ? }

? ? ? ? ? ? if (res.data == "pause") {

? ? ? ? ? ? ? ? document.getElementById("videoSource").pause();

? ? ? ? ? ? }

? ? ? ? ? ? if (res.date == "end") {

? ? ? ? ? ? ? ? document.getElementById("videoSource").pause();

? ? ? ? ? ? ? ? document.getElementById("videoSource").currentTime = 0;

? ? ? ? ? ? }

? ? ? ? };

? ? ? ? function setMessageInnerHTML(innerHTML) {

? ? ? ? ? ? document.getElementById('message').innerHTML += innerHTML + '<br/>';

? ? ? ? ? ? sendMessage = innerHTML;

? ? ? ? }

? ? ? ? function videoPlay() {

? ? ? ? ? ? document.getElementById("videoSource").play();

? ? ? ? ? ? // ws.send("video");

? ? ? ? }

? ? ? ? function videoPause() {

? ? ? ? ? ? document.getElementById("videoSource").pause();

? ? ? ? ? ? // ws.send("pause");

? ? ? ? }

? ? ? ? function videoEnd() {

? ? ? ? ? ? document.getElementById("videoSource").pause();

? ? ? ? ? ? document.getElementById("videoSource").currentTime = 0;

? ? ? ? ? ? // ws.send("end");

? ? ? ? }

? ? ? ? // window.onload = function () {

? ? ? ? //? ? var i = 0

? ? ? ? //? ? //開始播放視頻

? ? ? ? //? ? startV.onclick = function () {

? ? ? ? //? ? ? ? video.play();

? ? ? ? //? ? ? ? ws.send("video");

? ? ? ? //? ? ? ? if (sendMessage == "video") {

? ? ? ? //? ? ? ? ? ? video.play();

? ? ? ? //? ? ? ? ? ? alert("video")

? ? ? ? //? ? ? ? }

? ? ? ? //? ? ? ? console.log(sendMessage);

? ? ? ? //? ? }

? ? ? ? //? ? //暫停視頻播放

? ? ? ? //? ? pauseV.onclick = function () {

? ? ? ? //? ? ? ? video.pause();

? ? ? ? //? ? }

? ? ? ? //? ? endV.onclick = function () {

? ? ? ? //? ? ? ? video.pause();

? ? ? ? //? ? ? ? video.currentTime = 0;

? ? ? ? //? ? }

? ? ? ? // }

? ? </script>

</head>

<body>

? ? <h1>客戶端</h1>

? ? <p id="message"></p>

? ? <video id="videoSource" style="width: 450px;height: 400px;" muted="muted">

? ? ? ? <source src="./movie/m1.mp4" type="video/mp4">

? ? </video>

? ? <!-- <video src="./movie/m1.mp4" autoplay="autoplay" style="width: 450px;height: 400px;"></video> -->

? ? <!-- <button id="startV" onclick="videoPlay()">開始</button> -->

? ? <!-- <button id="pauseV" onclick="videoPause()">暫停</button> -->

? ? <!-- <button id="endV" onclick="videoEnd">停止</button> -->

</body>

</html>


效果如上~emmm,不知道怎么引用代碼,只能呈現效果這樣啦~

使用方法:

在這個項目的路徑使用cmd命令node sever.js,這里的server.js是服務器代碼的名字

在用兩個不同的瀏覽器開啟客戶端的html文件,你就可以試試有意思的效果啦~,這個也可用不同的兩個電腦去運行客戶端,

不過得改一下這里的ip地址,在局域網內能訪問到~

六、一般調試方法

1、像我比較習慣用alert輸出,看方法有沒有運行到這里

2、頁面改變樣式調試的話,一般習慣用backgroundColor來查看布局位置,接著用相應的屬性去控制

3、比較高大上的調試方法沒怎么用過,就不說啦,不然會誤人子弟的~~~

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。