關於移動端web開發的真機測試

五月已通過去一大半了,心情不太好,由於太困沒狀態,因此剛剛去跑了好幾圈,心情終於沒那麼鬱悶了,來吧,今天要記錄的是在作移動端網頁時如何真機測試。css

網上方法有不少,我就掌握一個就夠了<攤手>html

BrowserSync 能讓PC,移動端上的頁面實時地響應文件的更改,並不用刷新操做。並且,當在一個設備上進行點擊等行爲時,該行爲也會同步到其餘瀏覽器中。node

《1》安裝npm

BrowserSync是基於nodejs的,因此在安裝它以前,請確保本身的電腦已經安裝好nodejs咯。關於nodejsde 安裝不想囉嗦了,由於太多東西都是基於nodejs安裝好嗎。瀏覽器

nodejs安裝完成後,纔開始對BrowserSync進行簡單設置,包括安裝與監聽測試

<1>BrowserSync安裝server

打開終端窗口,輸入htm

npm install  -g browser-sync同步

稍等一會就安裝成功咯。ejs

<2>BrowserSync監聽

進入你的項目路徑下,files路徑是相對於當前路徑的,若是須要監聽多個類型的文件,須要用逗號隔開。

browser-sync start --server --files"css/*.css,js/*.js,*.html"

<3>移動端設置

   若使用移動端則首先先保證移動端設備和桌面端設備處於同一局域網(用電腦開360無線wifi,而後手機連電腦的wift就能夠)。在手機端訪問終端上顯示的地址:http://192.168.1.0.245:3000,實際狀況根據本身的終端顯示。

that 's all.

相關文章
相關標籤/搜索