@mcelo wrote:
Hi,
I’m building a PWA with @ionic/core + Stencil + Workbox, I’d like to take advantage of the lazy loading only for the first page (login) therefore after login I’d like to load all remaining pages.
Is this possible?
If not, is it possible to load all pages (including login) at once?Thanks,
Marco
Posts: 1
Participants: 1
@fahd123 wrote:
I testing app in my phone android it’s working but ion-icon not showing , when testing in browser it’s showing but in phone no.
{ "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json", "version": 1, "defaultProject": "app", "newProjectRoot": "projects", "projects": { "app": { "root": "", "sourceRoot": "src", "projectType": "application", "prefix": "app", "schematics": {}, "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { "outputPath": "www", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.app.json", "assets": [ { "glob": "**/*", "input": "src/assets", "output": "assets" }, { "glob": "**/*.svg", "input": "node_modules/ionicons/dist/ionicons/svg", "output": "./svg" } ], "styles": [ { "input": "src/theme/variables.scss" }, { "input": "src/global.scss" } ], "scripts": [] }, "configurations": { "production": { "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ], "optimization": true, "outputHashing": "all", "sourceMap": false, "extractCss": true, "namedChunks": false, "aot": true, "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true, "budgets": [ { "type": "initial", "maximumWarning": "2mb", "maximumError": "5mb" } ] }, "ci": { "progress": false } } }, "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { "browserTarget": "app:build" }, "configurations": { "production": { "browserTarget": "app:build:production" }, "ci": { "progress": false } } }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { "browserTarget": "app:build" } }, "test": { "builder": "@angular-devkit/build-angular:karma", "options": { "main": "src/test.ts", "polyfills": "src/polyfills.ts", "tsConfig": "src/tsconfig.spec.json", "karmaConfig": "src/karma.conf.js", "styles": [], "scripts": [], "assets": [ { "glob": "favicon.ico", "input": "src/", "output": "/" }, { "glob": "**/*", "input": "src/assets", "output": "/assets" } ] }, "configurations": { "ci": { "progress": false, "watch": false } } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": ["src/tsconfig.app.json", "src/tsconfig.spec.json"], "exclude": ["**/node_modules/**"] } }, "ionic-cordova-build": { "builder": "@ionic/angular-toolkit:cordova-build", "options": { "browserTarget": "app:build" }, "configurations": { "production": { "browserTarget": "app:build:production" } } }, "ionic-cordova-serve": { "builder": "@ionic/angular-toolkit:cordova-serve", "options": { "cordovaBuildTarget": "app:ionic-cordova-build", "devServerTarget": "app:serve" }, "configurations": { "production": { "cordovaBuildTarget": "app:ionic-cordova-build:production", "devServerTarget": "app:serve:production" } } } } }, "app-e2e": { "root": "e2e/", "projectType": "application", "architect": { "e2e": { "builder": "@angular-devkit/build-angular:protractor", "options": { "protractorConfig": "e2e/protractor.conf.js", "devServerTarget": "app:serve" }, "configurations": { "ci": { "devServerTarget": "app:serve:ci" } } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": "e2e/tsconfig.e2e.json", "exclude": ["**/node_modules/**"] } } } } }, "cli": { "defaultCollection": "@ionic/angular-toolkit" }, "schematics": { "@ionic/angular-toolkit:component": { "styleext": "scss" }, "@ionic/angular-toolkit:page": { "styleext": "scss" } } }
Posts: 1
Participants: 1
@Kyrax80 wrote:
Hello,
my App works almost perfectly on Android devices. It has acceptable (normal) performance.
But on iOS devices, even on an iPhone XS Max, the plugins are really slow.
I am checking if bluetooth, internet connection and gps are on and I have a spinner while all of this is being checked. Well, the spinner doesn’t even animate, it looks like a static image.
Also, on Xcode I am getting warning such as " THREAD WARNING: [‘Diagnostic_Location’] took ‘395.238037’ ms. Plugin should use a background thread.
I don’t know if the problem is when checking this stuff but this is my code incase this could be causing this performance issue:
private checkPreconditions(): void { this.platform.ready().then(() => { this.requestGPSPermissions(); if (this.network.type == "none") { this.hasInternet = false; let connection = this.network.onConnect().subscribe(() => { this.hasInternet = true; if (!this.positioning) if (!this.positioning) { this.events.publish("precondition:set"); this.events.publish("preconditioninit:set"); } if (!(this.detector as ViewRef).destroyed) this.detector.detectChanges(); connection.unsubscribe(); }); } else { this.hasInternet = true; if (!this.positioning) { this.events.publish("precondition:set"); this.events.publish("preconditioninit:set"); } } bluetoothSerial.isEnabled(() => { this.isBluetoothOn = true; if (!this.positioning) { this.events.publish("precondition:set"); this.events.publish("preconditioninit:set"); } if (!(this.detector as ViewRef).destroyed) this.detector.detectChanges(); }, () => this.enableBluetooth()); this.checkPreconditionsRunTime(true); }); } public requestGPSPermissions(): void { this.platform.ready().then(() => { this.permissionsService.checkLocationPermissions().then(permissions => { this.hasGPSPermission = permissions; if (permissions) { if (!this.positioning) { this.events.publish("precondition:set"); this.events.publish("preconditioninit:set"); } this.diagnostic.isLocationEnabled().then(on => { this.isGPSOn = on; if (on) { if (!this.positioning) { this.events.publish("precondition:set"); this.events.publish("preconditioninit:set"); } } else this.turnGPSOn(); }) } if (!(this.detector as ViewRef).destroyed) this.detector.detectChanges(); }) }) }Is there any way to solve this? The way this is now my App is pretty useless
Posts: 1
Participants: 1
@pantarmj wrote:
When I am building my ionic code for android by executing “ionic cordova build android”, I am getting this error:
Some plz help me to solve this…
@lucasbasquerotto
Posts: 1
Participants: 1
@maximegouin wrote:
Hello,
I have this error which I don’t succeed to solve. I don’t understand because I have copy the code from the documentation.
Someone has an idea?
Thanks
Maxime
Posts: 1
Participants: 1
@LacOniC wrote:
As most of you know, Angular suggests core.module for singleton services. For example auth.service is a service that should be in core module. And we put core module in -only- app.module.
In ionic samples i can’t see any core module implementation. Is it because of all ionic pages are lazy and lazy pages creates their own instance of services? Or is there any other reason that developers do not prefer to use core module in ionic?
Thanks in advance.
Posts: 1
Participants: 1
@newelementdesigns wrote:
Hello, When trying to use Angular Cleave Directive in Ionic 4 I’m getting this error:
Can't bind to 'cleave' since it isn't a known property of 'ion-input'. 1. If 'ion-input' is an Angular component and it has 'cleave' input, then verify that it is part of this module. 2. If 'ion-input' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.I have imported the module (new-reair.module.ts):
import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { Routes, RouterModule } from '@angular/router'; import { IonicModule } from '@ionic/angular'; import { NewRepairPage } from './new-repair.page'; import { NgxCleaveDirectiveModule } from 'ngx-cleave-directive'; const routes: Routes = [ { path: '', component: NewRepairPage } ]; @NgModule({ imports: [ CommonModule, FormsModule, IonicModule, NgxCleaveDirectiveModule, RouterModule.forChild(routes) ], declarations: [NewRepairPage] }) export class NewRepairPageModule {}And the template looks like this (new-repair.page.html) :
... <ion-item> <ion-label position="stacked">Phone</ion-label> <ion-input type="text" [cleave]="{phone: true}" (keyup)="onInputChange($event)" [(ngModel)]="repair.customer_phone"></ion-input> </ion-item> ...
Posts: 1
Participants: 1
@TVogel wrote:
Hey guys,
I’m working on an app which uses the SQLite plugin.
All worked fine till friday, when my app crashed and the config.xml became corrupted. I made a new project installed all the plugins again put the code back(generated pages with the cli command and rewrote the code).
It all worked fine again did have a white screen but a second startup did what it had to do.now I’m starting up my app with
ionic cordova run android, it starts the app loads the splashscreen but then I get a white screen.
While running the debugger I get this:App successfully launched Attaching to android Forwarding debug port Attaching to app. Native: tried accessing the SQLite plugin but it's not installed. common.js:272 Install the SQLite plugin: 'ionic cordova plugin add cordova-sqlite-storage' common.js:275 ERROR AppModule:1 Error: Failed to create db connection AppModule:1 ERROR CONTEXT AppModule:1 DebugContext_ {view: Object, nodeIndex: 1, nodeDef: Object, elDef: Object, elView: Object} AppModule:1 Error: Failed to create db connection main.ts:12 Ionic Native: deviceready event fired after 548 ms bootstrap.js:10SQLite is installed, and I even re-installed it but didn’t work.
When my app starts I load up my SQL in app.component.ts which calls my function initSql()
Which is in a global service:import { SQLite, SQLiteObject } from '@ionic-native/sqlite/ngx'; private db: SQLiteObject; public initSql() { const conn = this.sqlite.create({ name: 'berichten.db', location: 'default' }); if (conn == null) {throw Error('Failed to create db connection'); } conn.then((data) => { this.db = data; // tslint:disable-next-line:max-line-length this.db.executeSql('CREATE TABLE IF NOT EXISTS berichten (ID INTEGER PRIMARY KEY AUTOINCREMENT, title TEXT, `text` TEXT, date NUMERIC)', [] ).then(() => { this.notifications = this.getNotifications(); }) .catch(error => console.error('sqlite create error', error)); }).catch(error => console.error('initsql', error)); }What I did notice:
When I disable the initSql() in my app.component the app does start.
The AppModule:1 is not an existing file in my project base folder(it does not link to src/app)I’ve also tested the project on my colleague’s phone with the initSql() enabled, and it works.
Tomorrow I’ll be trying it on another phone
I hope I’ve provided enough information.
Posts: 1
Participants: 1
@thehuangkai wrote:
Hi guys,
I want to implement a function that checks if a new version of the app is available for update everytime a user opens the app. If they do not have auto-update turned on then this function will remind them to update the app.
How can this be achieved in ios / android for ionic3?
Posts: 1
Participants: 1
@kapking wrote:
Access to XMLHttpRequest at ‘http://localhost/projet_ionic/webserviceapi/serceur_ionic/aksi_user.php’ from origin ‘http://localhost:8100’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
Posts: 1
Participants: 1
@nharrer wrote:
I have created a new iOS app with ionic 4. When I upload it to the Apple App Store I get following warning:
The app references non-public selectors in Payload/FoobarApp.app/FoobarApp: _setAlwaysRunsAtForegroundPriority:The App works well and there are no other problems in the app store. Should I be worried however? You know how picky Apple is. Don’t want the app to be rejected.
I am using following plugins:
<plugin name="cordova-plugin-whitelist" spec="1.3.3" /> <plugin name="cordova-plugin-statusbar" spec="2.4.2" /> <plugin name="cordova-plugin-device" spec="2.0.2" /> <plugin name="cordova-plugin-splashscreen" spec="5.0.2" /> <plugin name="cordova-plugin-ionic-webview" spec="^3.0.0" /> <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" /> <plugin name="cordova-plugin-inappbrowser" spec="3.0.0" />I think everything besides inappbrowser is default.
Posts: 3
Participants: 2
@rafaelmoura wrote:
How to validate filds the input Ionic 4?
<ion-item> <ion-label position="floating">Matrícula</ion-label> <ion-input type="text" name="name" name="ngModel" [(ngModel)]="this.service.usuario.name" required></ion-input> <!-- <mat-error *ngIf="name.invalid && name.touched"> Fild Name <strong>required!</strong> </mat-error> --> </ion-item>
Posts: 1
Participants: 1
@michaelkariv wrote:
I am using ngrx (redux like) library as a core of my app.
I have effects (an ngrx term, something that listens to system-wide “actions” and react to some of them) that operate “api service”. the api service is simple - it just sends data back and force to server. Effects on the other hand dispatch “actions” of their own. For example, a ui component on a login form sends action “login” with payload of email and password. A corresponding effect gets it, calls the api service, gets response with a token, dispatches “login success” action.
So far so good, but sometimes a user misspelled an email - and api service returns an error. My question - should an effect deal with it - by prompting a Router or app’s root nav control to display a popup error message - or should it be left for a component to do?
An advantage of doing it in effect would be - using same error ui control universally, handling the error where it happened - and keeping components like login form true to its purpose - gathering user input.In the past Mike answered a somewhat similar question in the past.
But ngrx effects are not your regular service - it is more of like a business logic for the app, it seems to me - so does this logic still apply? I know it is as much of an ngrx question as it is ionic one. In fact ngrx sample app does just that - manages navigation in an effect - by calling injected Router methods.
What makes me want to ask this question here anyway is that ionic was in many ways prescriptive of the best practices and I want to be a good ionicdom citizen in this regard.
Posts: 1
Participants: 1
@ramashishb wrote:
Hi,
I am running into CORS issue on Android simulator. I have set ‘Accests-Control-Allow-Origin’ to ‘*’ to enable CORS on my APIs, but am getting the following error:
A wildcard ‘*’ cannot be used in the ‘Access-Control-Allow-Origin’ header when the credentials flag is true. Origin ‘http://localhost’ is therefore not allowed access
I am using
{withCredentials: true}in the post method, without this the HTTP session on my server didn’t seem to work.My environment:
cli packages: (/usr/lib/node_modules)
@ionic/cli-utils : 1.19.2 ionic (Ionic CLI) : 3.20.0global packages:
cordova (Cordova CLI) : 8.0.0local packages:
@ionic/app-scripts : 3.2.1 Cordova Platforms : android 7.0.0 Ionic Framework : ionic-angular 3.9.3System:
Android SDK Tools : 26.1.1 Node : v8.14.0 npm : 6.4.1 OS : Linux 4.10Environment Variables:
ANDROID_HOME : /home/ramashishb/Android/SdkMisc:
backend : proAny idea whats wrong?
Thanks,
Ramashish
Posts: 1
Participants: 1
@lunneyd wrote:
I have map displaying but if I scroll down it covers all the phone page sometimes so I can’t scroll up or down as instead it the the map that scrolls rather than the screen. Any ideas what to do.
Posts: 1
Participants: 1
@thomasmd wrote:
Hello everyone, i need some help with my ionic projet.
I use Youtube Api to get a video Id and then open the video with InAppBrowser plugin.It’s works with my browser and the ionic dev app. But not when i build my ipa file and run it on my ios device.
My configuration :
Ionic: ionic (Ionic CLI) : 4.7.1 (/usr/local/lib/node_modules/ionic) Ionic Framework : ionic-angular 3.9.2 @ionic/app-scripts : 3.2.1 Cordova: cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1) Cordova Platforms : ios 4.5.5 Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 9 other plugins) System: ios-deploy : 1.9.4 NodeJS : v10.15.0 (/usr/local/bin/node) npm : 6.4.1 OS : macOS Mojave Xcode : Xcode 10.1 Build version 10B61My provider :
public fetchTrailer(mediaTitle: string) { console.log("IN FETCH"); let searchText: string = mediaTitle + " bande annonce"; let url: string = YOUTUBE_API_URL +"search?maxResult=" +"1" +"&key=" +YOUTUBE_API_KEY +"&part=snippet&q=" +searchText; console.log("URL " + url); return new Promise (resolve => { this.http .get( YOUTUBE_API_URL + "search?maxResult=" + "1" + "&key=" + YOUTUBE_API_KEY + "&part=snippet&q=" + searchText ).subscribe( data => { resolve(data); }, err => { console.log(err); } ); }); }Xcode console error :
{"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":0,"statusText":"Unknown Error","url":null,"ok":false,"name":"HttpErrorResponse","message":"Http failure response for (unknown url): 0 Unknown Error","error":{"isTrusted":true}}Thanks a lot
Posts: 1
Participants: 1
@cdwebinfo wrote:
This error comes due to NDK version mismatch, To resolve this error you have to download an older version of NDK and need to remap NDK path. Then you can build the project successfully. To do this please follow the below steps provided on below URL -
Posts: 1
Participants: 1
@RaulGM wrote:
Hello everyone.
I’m developing a web app and I want to enable payment methods from my users to my clients (think it as I host some shops and I want the app users to pay directly to my clientes, not to me).
As the app is not transpiled to native code, I don’t think I can use cordova plugins such as PayPal. I would like to know which are the best options for this.
By the way, I’m using ionic v4
Thanks a lot.
Posts: 1
Participants: 1
@vance wrote:
Absolutely, 100% no
firebase-messagingin our src config.xml, plugins.xml, or any of our package.json or dependencies. I do find a reference in the AndroidManifest innode_modules/@capacitor/android/capacitor/src/main/AndroidManifestIsn’t Capacitor part of the Ionic tooling? This dependency is breaking gradle at build time, and I’m unsure of how to remove this dependency since it is part of Capacitor. I opened an issue with more details: https://github.com/ionic-team/ionic/issues/17816
Posts: 1
Participants: 1
