App加載本地Vue項目(一起打包)

1、修改資源(html, css, js, img)根路徑

 assetsPublicPath:'./' //vue-cli2
 assetsDir: './'     //vue-cli3

一定要注意是 ./ !!!

2、vue的路由模式為 hash.

3、Android加載Vue項目

3.1 將Vue項目生成的文件放到Android項目的Assets目錄下,使用WebView的loadUrl方法加載就行了
mWebView.loadUrl("file:///android_asset/vue/index.html"); 

ps:以上訪問的目錄結(jié)構(gòu)為 Assets/vue

3.2 vue中請求接口可能會跨域 安卓處理如下
WebSettings webSetting = mWebView.getSettings();
webSetting.setAllowUniversalAccessFromFileURLs(true);

4、iOS加載vue項目

Ios可以使用UIWebView或者WKWebView直接加載

<!--    UIWebView   -->
let mWebView = UIWebView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))
let path = Bundle.main.path(forResource: "index", ofType: "html", inDirectory: "vue")

let url = URL(fileURLWithPath: path!)
self.view.addSubview(mWebView)
mWebView.loadRequest(URLRequest(url: url))
<!--    WKWebView   -->
let mWebView = WKWebView.init(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height))
    
let path = Bundle.main.path(forResource: "index", ofType: "html", inDirectory: "vue")
    
let url = URL(fileURLWithPath: path!)
self.view.addSubview(mWebView)
mWebView.load(URLRequest(url: url))
放在App中打包無法訪問

未完待續(xù)……

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容