Carlos Aguni

Highly motivated self-taught IT analyst. Always learning and ready to explore new skills. An eternal apprentice.


Cordova Vuejs Android iOS

06 May 2022 »

install android studio

https://developer.android.com/studio?hl=pt-br#downloads

tar xzvf android-studio-2021.1.1.23-linux.tar.gz -C /opt/
yum -y install libglvnd-glx

gradle

wget https://services.gradle.org/distributions/gradle-7.4.2-bin.zip
yum -y install unzip
unzip gradle-7.4.2-bin.zip -d /opt/

node

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
. .bashrc
nvm ls-remote
nvm install v16.15.0
npm i -g cordova
npm i -g vue-cli
cordova create app
vue init webpack app

setup

https://medium.com/@valeriocapogna/how-to-setup-a-cordova-app-using-vue-js-8ba1315b9666

index.html

<html>
  <head>
    <meta charset="utf-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:; connect-src 'self' ws:;">
    <title>Project Name</title>
    <script src="cordova.js"></script>
  </head>
  <body>
    <div id="app"></div>
    ...

config/index.js

build: {
  index: path.resolve(__dirname, '../www/index.html'),
  assetsRoot: path.resolve(__dirname, '../www'),
  assetsSubDirectory: 'static',
  assetsPublicPath: ''
}

build/webpack.base.conf.js

publicPath: process.env.NODE_ENV === 'production' ? '../../' : '/'
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
  limit: 10000,
  name: utils.assetsPath('fonts/[name].[hash:7].[ext]'),
  publicPath: process.env.NODE_ENV === 'production' ? '../../' : '/'
}

build

export ANDROID_SDK_ROOT=/root/Android/Sdk/
export ANDROID_HOME=/root/Android/Sdk/
export PATH=${PATH}:${ANDROID_HOME}/emulator
export PATH=${PATH}:${ANDROID_HOME}/build-tools/33.0.0-rc3/
export PATH=${PATH}:${ANDROID_HOME}/platform-tools/bin
export PATH=${PATH}:${ANDROID_HOME}/tools/bin
export PATH="/opt/gradle-7.4.2/bin:$PATH"
export PATH="/opt/android-studio/jre/bin:$PATH"
export JAVA_BIN="/opt/android-studio/jre/bin/java"
cordova platform add android

npm run build
cordova build android
# cordova build ios

run android emulator

yum -y install java-1.8.0-openjdk java-1.8.0-openjdk-devel
export JAVA_HOME=/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.332.b09-1.el8_5.x86_64/jre/
cordova run android

in app browser

https://stackoverflow.com/questions/15594139/cordova-inappbrowser-how-to-disable-url-and-navigation-bar

ref = window.open(‘http://some.page/foo/’, ‘_blank’, ‘location=no,toolbar=no’);

https://www.javatpoint.com/cordova-plugin-inappbrowser

document.addEventListener("deviceready", onDeviceReady, false);  
function onDeviceReady() {  
    console.log("window.open works properly");  
}  
document.addEventListener("deviceready", onDeviceReady, false);
    function onDeviceReady() {
    console.log("window.open works properly");
    var ref = cordova.InAppBrowser.open('javanet', '_blank', 'location=no,toolbar=no,zoom=no');
}

Caveats

Android build tools

https://stackoverflow.com/questions/36683726/failed-to-find-build-tools-revision-23-0-1

https://stackoverflow.com/questions/31190355/ionic-build-android-error-no-installed-build-tools-found-please-install-the

export ANDROID_HOME=~/AppData/Local/Android/sdk
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

net::ERR_CLEARTEXT_NOT_PERMITTED

https://stackoverflow.com/questions/54752716/why-am-i-seeing-neterr-cleartext-not-permitted-errors-after-upgrading-to-cordo

add in config.xml

<platform name="android">
  <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
      <application android:usesCleartextTraffic="true" />
  </edit-config>
</platform>

and

<widget id="you-app-id" version="1.2.3"
xmlns="http://www.w3.org/ns/widgets" 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:cdv="http://cordova.apache.org/ns/1.0">