Images not found in Cordova app from Vue project - vue.js

Recently I have installed cordova into a VueJS project and almost everything works fine, but statics files are not found like images and I didnt figure out why.
I read something about relative paths like ../../assets and I tried to change to assets/ just to see if works but didnt.
Using scss, images are normally imported with require(../../assets so I tried to change all my img src to :src="require(../../assets)" but still have no success.
I never had to install cordova in a running project, so I didnt know if I'm missing some config.
Here is my src-cordova/config.js
<?xml version='1.0' encoding='utf-8'?>
<widget id="medcof.app.io" version="1.0.0" xmlns:android="http://schemas.android.com/apk/res/android" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>MedCofQBank</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<!-- this hook will point your config.xml to the DevServer on Serve -->
<hook type="after_prepare" src="../node_modules/vue-cli-plugin-cordova/serve-config-hook.js" />
<!-- this hook will point your config.xml to the DevServer on Serve -->
<hook type="after_prepare" src="../node_modules/vue-cli-plugin-cordova/serve-config-hook.js" />
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:usesCleartextTraffic="true" />
</edit-config>
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<preference name="AndroidPersistentFileLocation" value="Compatibility" />
</widget>

Related

connection error when creating app using cordova

I was try to create android app using vuejs and cordova. A connection error shown while opening app.
my .env
VUE_APP_URL='https://myapp.com'
cordova/config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.mealclub.app" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>UkMeals</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<!-- this hook will point your config.xml to the DevServer on Serve -->
<hook type="after_prepare" src="../node_modules/vue-cli-plugin-cordova/serve-config-hook.js" />
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
</widget>
Error image

How to remove white screen in ionic application

I have created an ionic application and when I load my application after splash screen and before login page a white flicker comes for about 3-4 seconds. But I want to remove it in my application .So please suggest how to do it.
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
first you have to add below preference in config.xml file
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="FadeSplashScreen" value="true" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="ShowSplashScreen" value="true" />
then use this "cordova-plugin-splashscreen" and check this link to add this plugin
splash screen cordova plugin
and in app.component.ts in intializeApp folder or in custructor put this code
this.platform.ready().then(() => {
this.splashScreen.hide();
});
and make sure when you make production build then use ionic cordova build android --prod.
I hope this will help you.

i am getting while running on my mobile. But it is running fine on ionic serve

Getting ERR_CLEARTEXT_NOT_PERMITTED error. I have tried every thing change my config.xml , network_config getting update automatically when i add my domain. ionic cli is 5.4.13
<?xml version='1.0' encoding='utf-8'?>
<widget id="io.ionic.starter" version="0.0.1" 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">
<name>MyApp</name>
<description>An awesome Ionic/Cordova app.</description>
<author email="hi#ionicframework.com" href="http://ionicframework.com/">Ionic Framework Team</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="19" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<platform name="android">
<access origin="*" />
<preference name="android-usesCleartextTraffic" value="true" />
<allow-navigation href="*" />
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
<application android:networkSecurityConfig="#xml/network_security_config" />
<application android:usesCleartextTraffic="true" />
</edit-config>
<resource-file src="resources/android/xml/network_security_config.xml" target="app/src/main/res/xml/network_security_config.xml" />
<allow-intent href="market:*" />
</platform>
</widget>
You can use ionic cordova http plugin for network request your error maybe solve.
Here is link for that
https://ionicframework.com/docs/native/http

Error logging in with google firebase, cordova, vuejs

Good day, I'm trying to log in with google and my config.xml file I have it this way
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.terabit.facilpark" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<hook src="hooks/hookers.js" type="before_prepare" />
<hook src="hooks/beforedep.js" type="before_deploy" />
<name>FacilPark</name>
<description>
</description>
<preference name="AndroidLaunchMode" value="singleTask" />
<universal-links>
<host name="facilpark19.page.link" scheme="https" />
<host name="facilpark-bdfd1.firebaseapp.com" scheme="https">
<path url="/__/auth/callback" />
</host>
</universal-links>
<author email="dev#cordova.apache.org" href="http://cordova.io">
Terabit
</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<allow-navigation href="*" />
<plugin name="cordova-plugin-whitelist" spec="^1.3.3" />
<plugin name="cordova-plugin-buildinfo" spec="^2.0.2" />
<plugin name="cordova-plugin-browsertab" spec="^0.2.0" />
<plugin name="cordova-plugin-inappbrowser" spec="^3.0.0" />
<plugin name="cordova-plugin-customurlscheme" spec="^4.3.0">
<variable name="URL_SCHEME" value="com.terabit.facilpark" />
</plugin>
<plugin name="cordova-universal-links-plugin" spec="~1.2.1" />
<plugin name="cordova-plugin-geolocation" spec="^4.0.1" />
<plugin name="cordova.plugins.diagnostic" spec="^4.0.10" />
<plugin name="cordova-open-native-settings" spec="^1.5.2" />
<plugin name="cordova-plugin-device" spec="^2.0.2" />
<engine name="browser" spec="^5.0.2" />
<engine name="android" spec="^7.0.0" />
</widget>
and the motod to initiate session in the following way:
loginGoogle(){
console.log("LOGIN GOOGLE");
const provider = new firebase.auth.GoogleAuthProvider();
firebase.auth().signInWithRedirect(provider).then(function() {
return firebase.auth().getRedirectResult();
}).then(result =>{
// This gives you a Google Access Token. You can use it to access the Google API.
console.log("AUTENTICACION POR GOOGLE EXITOSA")
this.completarInicio(user);
//this.$router.replace('home');
console.log(result);
var token = result.credential.accessToken;
// The signed-in user info.
var user = result.user;
// ...
}).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
// The email of the user's account used.
var email = error.email;
// The firebase.auth.AuthCredential type that was used.
var credential = error.credential;
// ...
});
},
The problem I have is to log in from the application, after having selected the google account and enter password I get the following message:
How can I correct the above mentioned, thank you very much.
Go to your Firebase Console, and on the Project Overview page there's a very small button called Add App. Select the OS and then enter your app bundle id.

Intellij 12 and websphere liberty 8.5 next beta - Application server libraries not found

I installed the latest WebSphere liberty profile to the Mac:
wlp-developers-runtime-8.5.next.beta.jar
WebSphere version is shown as 8.5.next.beta in Intellij.
In Intellij 12 I try to add this WebSphere Application Server and I get:
Cannot Save Settings: Application server libraries not found
If I look on the filesystem it seems that the location of:
com.ibm.ws.javaee.jsp.2.2_1.0.0.0.jar
com.ibm.ws.javaee.servlet.3.0_1.0.0.jar
has changes from /dev/spec to /dev/api/spec
I am not sure if this is the root cause, but Intellij seems to add these to the classpath in the previous version. Is there a way to get intellij up and running e.g. can I change the location where it looks for the libs?
Had the same issue. There are two ways.
Either unpack wlp 8.5 into the folder where you want to have wlp 8.5.next. Once unpacked, point IntelliJ to that folder and it will detect it. Once detected, just remove the wlp folder and unpack the 8.5.next in the same. Once done, correct the library paths.
Or; Open IntelliJ's other.xml-file (it's usually in ~/.IntelliJIDEA12/config/options/other.xml) and modify as following:
<?xml version="1.0" encoding="UTF-8"?>
<application>
<!-- other stuff -->
<component name="AppserversManager">
<LibraryTable>
<library name="WebSphere 8.5.Next.Beta">
<CLASSES>
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.annotation.1.1_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.cdi.1.0_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.ejb.3.1_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.el.2.2_1.0.1.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.interceptor.1.1_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jaxb.2.2_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jaxrs.1.1_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jaxws.2.2_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jms.1.1_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jsf.2.0_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jsf.tld.2.0_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jsp.2.2_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jsp.tld.2.2_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.jstl.1.2_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.persistence.2.0_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.servlet.3.0_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.transaction.1.1_1.0.0.jar!/" />
<root url="jar:///opt/wlp/dev/api/spec/com.ibm.ws.javaee.validation.1.0_1.0.0.jar!/" />
</CLASSES>
<JAVADOC />
<SOURCES />
</library>
</LibraryTable>
<ServerDK NAME="WebSphere 8.5.Next.Beta">
<option name="SOURCE_INTEGRATION_NAME" value="WebSphere Server" />
<DATA>
<state>
<option name="home" value="/opt/wlp" />
<option name="version" value="8.5.next.beta" />
</state>
</DATA>
</ServerDK>
</component>
<!-- rest -->
</application>
This has now been officially fixed in Intelli 12.1.2 and newer. The release notes and original ticket have further details.