前段時間，做了一個混合開發的項目，主要是以vue框架開發h5頁面，使用cordova作為中間溝通橋梁，實現了h5與安卓、iOS的混合開發，由於從事iOS開發，h5也是剛接觸不久，很多深入原理還不太清楚，只說下我們這個個項目的開發流程，記錄過程中遇到的比較大的問題。
1、創建vue項目，具體流程可參考下圖（基於mac）：
2、開發完畢后對vue項目進行編譯，編譯之前需要對配置進行一些更改，在目錄config下，找到index.js文件，把assetsPublicPath:'/'，修改為：assetsPublicPath:'./',
經過測試發現不修改可能會造成資源文件找不到的問題，另外需要注意的是，圖片資源不要放到文件static目錄下，否則同樣會造成資源文件找不到。配置文件之后，執行命令：npm run build，執行結果如下圖所示（部分）：
3、編譯完成后會生成dist文件，如下圖所示：
4、在原生可通過讀取文件dist文件目錄下的index.html進行展示h5頁面。
5、需要跳轉到某一個單獨的h5頁面，可使用路由進行單個頁面跳轉：
var path = "/detail"; var url = "/index.html#"+path;
其中path就是要跳轉頁面在router中的定義
這樣就完成了原生調用vue編寫的h5頁面了。