Quantcast
Channel: Ionic Forum - Latest posts
Viewing all 228535 articles
Browse latest View live
↧

Android icon breaks on release build with Cordova Android ^8.0.0

January 16, 2020, 12:32 am
$
0
0

Ionic 3 with Cordova Android 8.1.0

When I reinstall the Cordova Android platform and run the code on a device, the home screen icon works fine.
When I build the code with the --release flag, and run it on a newer Android device, the home screen icon shows a generic Android icon.

Ionic info:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.2
    ionic (Ionic CLI) : 3.20.0

global packages:

    cordova (Cordova CLI) : 9.0.0 (cordova-lib@9.0.1) 

local packages:

    @ionic/app-scripts : 3.2.4
    Cordova Platforms  : android 8.1.0 browser 5.0.4 ios 5.1.1
    Ionic Framework    : ionic-angular 3.9.9

System:

    ios-deploy : 1.9.2 
    ios-sim    : 6.1.3 
    Node       : v8.11.1
    npm        : 5.6.0 
    OS         : macOS
    Xcode      : Xcode 11.2.1 Build version 11B500 

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro
↧
Search

Aot build, webpack missing module, cannot find module "."

January 16, 2020, 12:36 am
$
0
0

Thanks for the reply,

I have unfortunately not found a solution to the issue, and I am continuously running my code without the --aot flag.

I will also update if I solve the issue.

↧
↧

Webpack prevents offline mode from working correctly on browsers

January 16, 2020, 12:37 am
$
0
0

Hey,

I am attempting your solution although i am having trouble with it working. Basically i get a console error

"Service worker registration failed with: TypeError: "ServiceWorker script at http://localhost:8100/ngsw-"worker.js for scope http://localhost:8100/ error encountered during installation. "

I have registered it in app.module.ts
ServiceWorkerModule.register(‘ngsw-worker.js’, {enabled: environment.production});

The environment variable is in fact set to true.

Additionally the build does generate a ngsw-worker.js file in the www directory. I am puzzled why it doesn’t work. I assume that ionics routing is somehow preventing the webserver from being able to find the js file and load it.

↧

How to add a preloader or message box that appears during the loading of each page in inAppBrowser?

January 16, 2020, 12:55 am
$
0
0

I have an application that just open inAppBrowser, I’d like to add something for a good user experience, because both the application itself and the pages load too slowly. I tried to do this in different ways, from simply inserting js, html, css into inAppBrowser, delayed by splashScreen.hide(), and ending with different libraries like SpinnerDialog. I also tried to do this through angular CanActivate guard. In all cases, I couldn’t achieve the desired behavior, or nothing happens, or the loader only at startup, or even a white screen. Here, for example, is one of the first solutions that I found:
`import { Component } from “@angular/core”;
import { Platform } from “ionic-angular”;
import { InAppBrowser } from “@ionic-native/in-app-browser”;
import { SpinnerDialog } from ‘@ionic-native/spinner-dialog/ngx’;

@Component({
template: <p>Loading...</p>
})
export class HomePage {
constructor(private iab: InAppBrowser, public platform: Platform, private spinnerDialog: SpinnerDialog) {

platform.ready().then(() => {
  let browser = this.iab.create("'https://www.google.com'", "_blank", {
    location: "no",
    zoom: "no"
  });

  browser.on('loadstart').subscribe((eve) => {
    this.spinnerDialog.show(null, null, true);     
  }, err => {
    this.spinnerDialog.hide();
  })
  
  browser.on('loadstop').subscribe(()=>{
    this.spinnerDialog.hide();
  }, err =>{
    this.spinnerDialog.hide();
  })
  
  browser.on('loaderror').subscribe(()=>{
    this.spinnerDialog.hide();
  }, err =>{
    this.spinnerDialog.hide();
  })
  
  browser.on('exit').subscribe(()=>{
    this.spinnerDialog.hide();
  }, err =>{
    this.spinnerDialog.hide();
  })

  browser.show();
});

}
}` But I just have a white screen.
I can provide any information you need, I complete this task for several days…

↧

How to add a preloader or message box that appears during the loading of each page in inAppBrowser?

January 16, 2020, 1:25 am
$
0
0

Can you check with this link. This having some explanation.

↧
↧

How to add a preloader or message box that appears during the loading of each page in inAppBrowser?

January 16, 2020, 1:28 am
$
0
0

Yes, this is one of the first links that I googled, but I can’t do it like that - just a white screen and I don’t understand why

↧

How to add a preloader or message box that appears during the loading of each page in inAppBrowser?

January 16, 2020, 1:37 am
$
0
0

Did you check with native spinner which is the second answer in the link?

↧

Cordova printer plugin not working

January 16, 2020, 1:53 am
$
0
0

How to do that? Any idea?
Thanks in Advance

↧
Search

Ionic cache for socket data

January 16, 2020, 1:57 am
$
0
0

Hi all, I am able to receive data through sockets, but I need a cache for socket data. I saw cache data for get request example but didn’t found any solution for socket data cache, soo please help me.

↧
↧

How to add a preloader or message box that appears during the loading of each page in inAppBrowser?

January 16, 2020, 2:00 am
↧

Development and production workflow

January 16, 2020, 2:18 am
↧

Webpack prevents offline mode from working correctly on browsers

January 16, 2020, 2:20 am
$
0
0

After looking into this issue in more depth, i found out that angular service worker will not load if you run your website using the generic command ionic serve. The service worker file ngsw-worker.js will never be found. What i did instead of this is setup WAMP and ran the project on an apache server. The service worker then loaded as exptected without any trouble. I am sure there alternative server solutions will also resolve the issue for you.

It seems like the server configuration provided by ionic serve is simply not compatible for this kind of file serving.

Overall to the initial problem i asked about in the topic, Service workers seem to be the way to go :slight_smile:

↧

How to add a preloader or message box that appears during the loading of each page in inAppBrowser?

January 16, 2020, 2:37 am
$
0
0

lets try this way.

constructor(private iab: InAppBrowser) { }

const browser = this.iab.create(‘https://ionicframework.com/’);

browser.on(‘loadstart’).subscribe(event => {
//inside a class create the below css properties and call here
browser.insertCSS({ .loader(// refer below css ) });
});

.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

browser.close();

↧
↧

Development and production workflow

January 16, 2020, 3:06 am
↧

[Ionic 4] - Submit app to google play store for testing

January 16, 2020, 3:14 am
↧
Search

Can we use query params in ionic4?

January 16, 2020, 3:29 am
$
0
0

We have used query params for angular projects. can we use qury parmas in ionic project?
is there any side effect or security issues?

↧

How to use facebook auth integration in Ionic 4 capacitor app

January 16, 2020, 3:35 am
$
0
0

How we can use facebook auth integration in Ionic 4 capacitor app.
After installing facebook4 cordova and npm I am getting following error…

> \android\capacitor-cordova-android-plugins\src\main\java\org\apache\cordova\facebook\ConnectPlugin.java:
uses or overrides a deprecated API.

Cordova packages are not able to integrate, while running it on emulator.

Commands used to install cordova packages -

> ionic cordova plugin add cordova-plugin-facebook4 --variable APP_ID="##########" --variable APP_NAME="#######"
> npm install @ionic-native/facebook --save

> npm run build
> npx cap sync
> npx cap copy android
> ionic capacitor run android --emulator -l --address=192.168.0.127

↧
↧

How to open filechooser with a filter on a google drive folder

January 16, 2020, 3:47 am
↧

How to declare and initialize an empty array of objects

January 16, 2020, 3:57 am
$
0
0

I’m trying to declare an array of objects to add new objects later. I’m doing this away:
private arrayOfObjects: [{}];

When I try to push some object to it I receive the following error:

Cannot read property ‘push’ of undefined

I believe this is because the array needs to be initialized. If I initialize it like a normal array:
private arrayOfObjects: [{}] = [];

I get another error:

Property ‘0’ is missing in type ‘[ ]’ but required in type ‘[{}]’.

So if I declare the array this way:
private arrayOfObjects: [{}] = [{}];

I can now push objects to it, but I get an empty object in the beginning of the array. I can easily remove this object from the array, but I really want to know how I can do it correctly. I could not find any similar problem in here or in SO.

So, how can I declare and initialize an array of objects without the empty object in it?

↧

Bundling Ionic 4 with rollup.js?

January 16, 2020, 4:00 am
$
0
0

Hi, I’m interested in using Ionic 4 web components in a svelte application, treating Ionic as a javascript library (as opposed to Angular/React/etc). Svelte is a new-ish framework that compiles down to pure-javascript.

I have a repo here: https://github.com/tnishimura/ionic-svelte-demo

When I load the js and CSS from a CDN as describe in the doc at , everything works well:

<script type="module" src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ionic/core/css/ionic.bundle.css"/>

However, I’d like to bundle all javascript and css with rollup. So far, all my attempts have failed, not sure if it’s because of Svelte or because I’m doing something dumb. I’ve tried variety of things like:

import '@ionic/core';
import '@ionic/core/dist/ionic/ionic.esm.js';
import Ionic from '@ionic/core'
import '../node_modules/@ionic/core/dist/ionic/ionic.js';

and in no case does it allow me to use <ion-*> web components. Any help?

↧
Viewing all 228535 articles
Browse latest View live
Search
<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>