緣由
- 在開發vue的過程中,
npm run build
後生成的檔案需要在服務端才可以使用 - 本地使用引入
less.min.js
檔案來進行除錯時,也依賴伺服器環境,不要吐槽為什麼不用less-loader
...... - 只需要放置一個靜態頁面的簡單伺服器。
- etc.
以往使用的是類似基於appche的xammp工具,但xammp有些笨重(200M+),於是選擇用nodejs
來實現一個簡單的服務,來放置頁面。
現狀
nodejs本身已經提供了建立服務的方法createServer
,但沒有提供頁面入口,express
,koa
等框架提供了,但略複雜。
使用方法
因此,寫了一個簡單的無依賴的服務,用來預覽頁面。使用方法如下:
git clone https://github.com/sumnow/simple-server.git
node server.js
複製程式碼
開啟瀏覽器http://localhost:8080 即可檢視效果。
預設服務啟動在8080
埠,預覽目錄下的index.html
,可以修改server.js
來改變埠和頁面地址。
var port = 8080;
var pagePath = "/index.html"
複製程式碼
原理分析
原理就是Browser向Server請求頁面的時候,其實是一個GET
請求,不過是按照不同的Content-Type
來解析
"css": "text/css",
"gif": "image/gif",
"html": "text/html",
"ico": "image/x-icon",
"jpeg": "image/jpeg",
"jpg": "image/jpeg",
"js": "text/javascript",
"json": "application/json",
"pdf": "application/pdf",
"png": "image/png",
"svg": "image/svg+xml",
"swf": "application/x-shockwave-flash",
"tiff": "image/tiff",
"txt": "text/plain",
"wav": "audio/x-wav",
"wma": "audio/x-ms-wma",
"wmv": "video/x-ms-wmv",
"xml": "text/xml"
複製程式碼
例如以上的常見檔案格式以及type
,按照type
返回給Browser就可以正常解析啦。
使用體驗
目前基於這個建立的自用FileServer執行良好~
專案地址: github.com/sumnow/simp…