VueAndroid studio【idea】

App加载本地Vue项目(一起打包)

2019-07-18  本文已影响67人  取个帅气的名字真好

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:以上访问的目录结构为 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中打包无法访问

未完待续……

上一篇 下一篇

猜你喜欢

热点阅读