Develop Reference

Ionic One signal Plugin not installed in ionic 6 android platform 10.0.0 issue

I am using ionic 6 project and installed one signal plugin for notification.
$ ionic cordova plugin add onesignal-cordova-plugin
$ npm install #awesome-cordova-plugins/onesignal
Plugin version in my package.json.
"onesignal-cordova-plugin": "^3.1.0",
"#awesome-cordova-plugins/onesignal": "^5.44.0",
Android Platform version *** android 10.0.0 ***
After Implementing, made build by ionic cordova build android / by --prod and installed it.
After opening the installed application its throw error of
ERROR Error: Uncaught (in promise): plugin_not_installed
[ERROR Error: Uncaught (in promise): plugin_not_installed ][2]
[2]: https://i.stack.imgur.com/zUBxy.png
vendor.js:82382 ERROR Error: Uncaught (in promise): plugin_not_installed
at resolvePromise (polyfills.js:1364:35)
at polyfills.js:1271:21
at rejected (vendor.js:42934:89)
at push.3484._ZoneDelegate.invoke (polyfills.js:511:30)
at Object.onInvoke (vendor.js:101445:33)
at push.3484._ZoneDelegate.invoke (polyfills.js:510:56)
at push.3484.Zone.run (polyfills.js:271:47)
at polyfills.js:1428:38
at push.3484._ZoneDelegate.invokeTask (polyfills.js:545:35)
at Object.onInvokeTask (vendor.js:101432:33)
I have tired installing all versions: 5.36.0,5.36.1,5.37.0 etc from https://www.npmjs.com/package/#awesome-cordova-plugins/onesignal/v/5.37.0
but still facing the same issue.
Package.json file
{
"name": "My App",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "https://ionicframework.com/",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/common": "~13.2.2",
"#angular/core": "~13.2.2",
"#angular/forms": "~13.2.2",
"#angular/platform-browser": "~13.2.2",
"#angular/platform-browser-dynamic": "~13.2.2",
"#angular/router": "~13.2.2",
"#awesome-cordova-plugins/core": "^5.43.0",
"#awesome-cordova-plugins/onesignal": "^5.44.0",
"#awesome-cordova-plugins/status-bar": "^5.43.0",
"#capacitor/app": "1.1.1",
"#capacitor/haptics": "1.1.4",
"#capacitor/keyboard": "1.2.2",
"#capacitor/status-bar": "1.0.8",
"#ionic-native/core": "^5.36.0",
"#ionic/angular": "^6.0.0",
"#ionic/cordova-builders": "^6.1.0",
"#ionic/storage": "^2.2.0",
"com.razorpay.cordova": "1.4.14",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-ionic-keyboard": "^2.2.0",
"cordova-plugin-ionic-webview": "^5.0.0",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"rxjs": "~6.6.0",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "~13.2.3",
"#angular-eslint/builder": "~13.0.1",
"#angular-eslint/eslint-plugin": "~13.0.1",
"#angular-eslint/eslint-plugin-template": "~13.0.1",
"#angular-eslint/template-parser": "~13.0.1",
"#angular/cli": "~13.2.3",
"#angular/compiler": "~13.2.2",
"#angular/compiler-cli": "~13.2.2",
"#angular/language-service": "~13.2.2",
"#ionic/angular-toolkit": "^6.0.0",
"#types/jasmine": "~3.6.0",
"#types/jasminewd2": "~2.0.3",
"#types/node": "^12.11.1",
"#typescript-eslint/eslint-plugin": "5.3.0",
"#typescript-eslint/parser": "5.3.0",
"cordova-android": "^10.0.0",
"cordova-browser": "^6.0.0",
"cordova-sqlite-storage": "^6.0.0",
"eslint": "^7.6.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsdoc": "30.7.6",
"eslint-plugin-prefer-arrow": "1.2.2",
"jasmine-core": "~3.8.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.3.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"onesignal-cordova-plugin": "^3.1.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"typescript": "~4.4.4"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-sqlite-storage": {},
"onesignal-cordova-plugin": {},
"com.razorpay.cordova": {}
},
"platforms": [
"browser",
"android"
]
}
}
called onesingal function after platform ready in > app.component.ts .
constructor(private navCtrl: NavController, private platform: Platform,
private statusBar: StatusBar, public oneSignal: OnesignalService) {
this.appInitialize();
}
appInitialize() {
this.platform.ready().then(() => {
this.statusBar.backgroundColorByHexString('#ff6657');
this.oneSignal.OneSignalNotification();
});
}
Please guide , if anyone faced this issue and resolved it.

For Capacitor:
import OneSignal from 'onesignal-cordova-plugin';
async OneSignalInit() {
OneSignal.setAppId(this.ONESIGNAL_APP_ID);
OneSignal.setNotificationOpenedHandler((jsonData) => {
console.log('notificationOpenedCallback: ' + JSON.stringify(jsonData));
});
OneSignal.promptForPushNotificationsWithUserResponse((accepted) => {
console.log('User accepted notifications: ' + accepted);
});
}

"Error: Uncaught (in promise): plugin_not_installed" when using command --livereload ionic/angular on real device android

My ionic/angular app works perfectly ON REAL ANDROID DEVICE when running ionic cordova run android --device. But when running ionic cordova run android --device --livereload it won't work. I've tried every workaround on the web, nothing seems to fix the error.
Already checked my ANDROID_PLATFORM_PATH as suggested here https://github.com/ionic-team/ionic-app-scripts/issues/1354
serve-config.js
exports.ANDROID_PLATFORM_PATHS = [
path.join('platforms', 'android', 'assets', 'www'),
path.join('platforms', 'android', 'app', 'src', 'main', 'assets', 'www')
];
/node_modules/ #ionic/ app-scripts/ dist/ dev-server/ live-reload.d.ts/ live-reload.d.ts
import { ServeConfig } from './serve-config';
export declare function createLiveReloadServer(config: ServeConfig): void;
export declare function injectLiveReloadScript(content: any, host: string, port: Number): any;
node_modules/ #ionic/ app-scripts/ dist/ dev-server/ live-reload.js
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var logger_diagnostics_1 = require("../logger/logger-diagnostics");
var path = require("path");
var tinylr = require("tiny-lr");
var events = require("../util/events");
function createLiveReloadServer(config) {
var liveReloadServer = tinylr();
liveReloadServer.listen(config.liveReloadPort, config.host);
function fileChange(changedFiles) {
// only do a live reload if there are no diagnostics
// the notification server takes care of showing diagnostics
if (!logger_diagnostics_1.hasDiagnostics(config.buildDir)) {
liveReloadServer.changed({
body: {
files: changedFiles.map(function (changedFile) { return '/' + path.relative(config.wwwDir, changedFile.filePath); })
}
});
}
}
events.on(events.EventType.FileChange, fileChange);
events.on(events.EventType.ReloadApp, function () {
fileChange([{ event: 'change', ext: '.html', filePath: 'index.html' }]);
});
}
exports.createLiveReloadServer = createLiveReloadServer;
function injectLiveReloadScript(content, host, port) {
var contentStr = content.toString();
var liveReloadScript = getLiveReloadScript(host, port);
if (contentStr.indexOf('/livereload.js') > -1) {
// already added script
return content;
}
var match = contentStr.match(/<\/body>(?![\s\S]*<\/body>)/i);
if (!match) {
match = contentStr.match(/<\/html>(?![\s\S]*<\/html>)/i);
}
if (match) {
contentStr = contentStr.replace(match[0], liveReloadScript + "\n" + match[0]);
}
else {
contentStr += liveReloadScript;
}
return contentStr;
}
exports.injectLiveReloadScript = injectLiveReloadScript;
function getLiveReloadScript(host, port) {
var src = "//" + host + ":" + port + "/livereload.js?snipver=1";
return " <!-- Ionic Dev Server: Injected LiveReload Script -->\n <script src=\"" + src + "\" async=\"\" defer=\"\"></script>";
}
$ ionic info
Ionic:
Ionic CLI : 6.12.2 (/usr/local/lib/node_modules/#ionic/cli)
Ionic Framework : ionic-angular 3.9.10
#ionic/app-scripts : 3.2.4
Cordova:
Cordova CLI : 8.1.2 (cordova-lib#8.1.1)
Cordova Platforms : 5.0.4, android 7.1.4, browser
Cordova Plugins : no whitelisted plugins (23 plugins total)
Utility:
cordova-res : 0.15.2
native-run : 1.2.2
System:
NodeJS : v10.19.0 (/usr/bin/node)
npm : 6.14.4
OS : Linux 5.4
ERROR DESCRIPTION in browser
ERROR Error: Uncaught (in promise): plugin_not_installed
at c (polyfills.js:3)
at c (polyfills.js:3)
at polyfills.js:3
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (vendor.js:17748)
at t.invokeTask (polyfills.js:3)
at r.runTask (polyfills.js:3)
at o (polyfills.js:3)
package.json
{
"name": "some-app",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/common": "^7.2.15",
"#angular/compiler": "^7.2.15",
"#angular/compiler-cli": "^7.2.15",
"#angular/core": "^7.2.15",
"#angular/forms": "^7.2.15",
"#angular/http": "^7.2.16",
"#angular/platform-browser": "^7.2.15",
"#angular/platform-browser-dynamic": "^7.2.15",
"#angular/tsc-wrapped": "4.4.6",
"#ionic-native/camera": "^4.18.0",
"#ionic-native/core": "^4.18.0",
"#ionic-native/email-composer": "^4.18.0",
"#ionic-native/file": "^4.18.0",
"#ionic-native/geolocation": "^4.18.0",
"#ionic-native/google-maps": "^4.15.1",
"#ionic-native/hotspot": "^4.20.0",
"#ionic-native/launch-navigator": "^4.18.0",
"#ionic-native/local-notifications": "^4.20.0",
"#ionic-native/native-geocoder": "^4.18.0",
"#ionic-native/network": "^4.18.0",
"#ionic-native/splash-screen": "^4.18.0",
"#ionic-native/sqlite": "^4.18.0",
"#ionic-native/status-bar": "^4.20.0",
"#ionic/storage": "^2.2.0",
"android-versions": "^1.5.0",
"angular2-signaturepad": "^2.11.0",
"autoprefixer": "^9.7.6",
"cordova": "^8.1.2",
"cordova-android": "7.1.4",
"cordova-android-support-gradle-release": "^2.0.1",
"cordova-browser": "5.0.4",
"cordova-plugin-actionsheet": "^2.3.3",
"cordova-plugin-badge": "0.8.8",
"cordova-plugin-camera": "^4.1.0",
"cordova-plugin-cleartext": "^1.0.0",
"cordova-plugin-compat": "^1.2.0",
"cordova-plugin-console": "^1.1.0",
"cordova-plugin-device": "^2.0.3",
"cordova-plugin-dialogs": "^2.0.2",
"cordova-plugin-email-composer": "^0.9.2",
"cordova-plugin-file": "^6.0.2",
"cordova-plugin-geolocation": "^4.0.2",
"cordova-plugin-hotspot": "^1.2.10",
"cordova-plugin-local-notification": "0.9.0-beta.2",
"cordova-plugin-nativegeocoder": "^3.4.1",
"cordova-plugin-network-information": "^2.0.2",
"cordova-plugin-splashscreen": "^5.0.3",
"cordova-plugin-statusbar": "^2.4.3",
"cordova-plugin-telerik-imagepicker": "^2.3.3",
"cordova-plugin-whitelist": "^1.3.4",
"cordova-res": "^0.15.2",
"cordova-sqlite-storage": "^2.6.0",
"ionic-angular": "^3.9.10",
"ionic-img-viewer": "^2.9.0",
"ionic-plugin-keyboard": "^2.2.1",
"ionic2-rating": "^1.2.2",
"ionicons": "^4.6.3",
"moment": "^2.25.3",
"moment-duration-format": "^2.3.2",
"rxjs": "^6.5.5",
"rxjs-compat": "^6.5.5",
"sw-toolbox": "3.6.0",
"uk.co.workingedge.phonegap.plugin.launchnavigator": "^4.2.2",
"zone.js": "^0.8.24"
},
"devDependencies": {
"#ionic/app-scripts": "3.2.4",
"#types/moment-duration-format": "^2.2.2",
"#types/moment-round": "^1.0.3",
"moment-round": "^1.0.1",
"typescript": "^3.1.1"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"ionic-plugin-keyboard": {},
"cordova-plugin-whitelist": {},
"cordova-plugin-console": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-geolocation": {},
"uk.co.workingedge.phonegap.plugin.launchnavigator": {
"OKHTTP_VERSION": "3.+"
},
"cordova-plugin-camera": {},
"cordova-plugin-nativegeocoder": {},
"cordova-plugin-network-information": {},
"cordova-plugin-email-composer": {},
"cordova-plugin-file": {},
"cordova-sqlite-storage": {},
"cordova-plugin-telerik-imagepicker": {
"PHOTO_LIBRARY_USAGE_DESCRIPTION": "imagepicker para PSDigital"
},
"cordova-android-support-gradle-release": {
"ANDROID_SUPPORT_VERSION": "27.+"
},
"cordova-plugin-local-notification": {},
"cordova-plugin-hotspot": {},
"cordova-plugin-cleartext": {},
"cordova-plugin-device": {}
},
"platforms": [
"android",
"browser"
]
}
}

Ionic 4 Select Multiple Image From Gallery with Image-picker Not Working

I Use Image-Picker for select multiple Image From Gallery But I Get The "Plugin_not_installed"
I Use From link To Install plugin ionic image picker
ionic cordova plugin add cordova-plugin-telerik-imagepicker
npm install #ionic-native/image-picker
after install cordova plugin and telerik image picker in my package.json :
{
"name": "sheedo",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "https://ionicframework.com/",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/common": "~8.1.2",
"#angular/compiler": "~8.1.2",
"#angular/core": "~8.1.2",
"#angular/forms": "~8.1.2",
"#angular/platform-browser": "~8.1.2",
"#angular/platform-browser-dynamic": "~8.1.2",
"#angular/router": "~8.1.2",
"#ionic-native/camera": "^5.14.0",
"#ionic-native/core": "^5.14.0",
"#ionic-native/file": "^5.14.0",
"#ionic-native/image-picker": "^5.14.0",
"#ionic-native/screen-orientation": "^5.14.0",
"#ionic-native/splash-screen": "^5.0.0",
"#ionic-native/status-bar": "^5.0.0",
"#ionic/angular": "^4.7.1",
"cordova-android": "8.1.0",
"cordova-ios": "^5.0.1",
"cordova-plugin-camera": "^4.1.0",
"cordova-plugin-file": "^6.0.2",
"cordova-plugin-screen-orientation": "^3.0.2",
"cordova-plugin-telerik-imagepicker": "^2.3.3",
"core-js": "^2.5.4",
"es6-promise-plugin": "^4.2.2",
"ionic4-hidenav": "^0.1.2",
"jalali-moment": "^3.3.3",
"rxjs": "~6.5.1",
"tslib": "^1.9.0",
"zone.js": "~0.9.1"
},
"devDependencies": {
"#angular-devkit/architect": "~0.801.2",
"#angular-devkit/build-angular": "~0.801.2",
"#angular-devkit/core": "~8.1.2",
"#angular-devkit/schematics": "~8.1.2",
"#angular/cli": "~8.1.2",
"#angular/compiler": "~8.1.2",
"#angular/compiler-cli": "~8.1.2",
"#angular/language-service": "~8.1.2",
"#ionic/angular-toolkit": "~2.0.0",
"#types/jasmine": "~3.3.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~8.9.4",
"codelyzer": "^5.0.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-ionic-webview": "^4.1.1",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.4.3"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {
"ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-screen-orientation": {},
"cordova-plugin-camera": {
"ANDROID_SUPPORT_V4_VERSION": "27.+"
},
"cordova-plugin-file": {},
"cordova-plugin-telerik-imagepicker": {
"PHOTO_LIBRARY_USAGE_DESCRIPTION": " "
}
},
"platforms": [
"ios"
]
}
}
and for use image picker
let options: ImagePickerOptions = {
maximumImagesCount: 8
};`enter code here`
if( !this.imagePicker.hasReadPermission) this.imagePicker.requestReadPermission();
this.imagePicker.getPictures(options).then((results) => {
for (var i = 0; i < results.length; i++) {
console.log('Image URI: ' + results[i]);
}
}, (err) => {alert(err) });
and for run use ionic serve --devapp
and when click on getImage i use alert for get error
"Plugin_not_installed"
and in vsCode Console
`[ng] [console.warn]: "Native: tried calling ImagePicker.getPictures, but the ImagePicker plugin is not installed."
[ng] [console.warn]: "Install the ImagePicker plugin: 'ionic cordova plugin add cordova-plugin-telerik-imagepicker'"`
All the examples on the Internet have done this
also i test command
npm install #ionic-native/image-picker#4
for install version 4 but app not build.
my ionic version is 4 and i run android platform

You can use
https://ionicframework.com/docs/native/image-picker
ionic cordova plugin add cordova-plugin-telerik-imagepicker
npm install #ionic-native/image-picker
* `cordova plugin add cordova-android-support-gradle-release`
* `ioinc cordova platform rm android`
* `ionic cordova platform add android`
* `ionic cordova build android --prod`
import { ImagePicker, ImagePickerOptions } from '#ionic-native/image-picker/ngx';
constructor(private imagePicker: ImagePicker) { }
getPictures() {
let options: ImagePickerOptions = {
//here Quality of images, defaults to 100
quality: 100,
//here Width of an Image
width: 600,
//here Height of an Image
height: 600,
/** Output type, defaults to 0 (FILE_URI).
* FILE_URI :0 (number) it returns a actual path for an image
*/
outputType: 1
//here Maximum image count for selection, defaults to 15.
//while setting a number 15 we can load 15 images in one selection.
maximumImagesCount: 8
// max images to be selected, defaults to 15. If this is set to 1
};
this.imagePicker.getPictures(options)
.then(selectedImg => { })
}

try using the plugin in a non-native way.
In your component declare a window variable and then use it to call the plugin. You need to test it from a device, it's not working on browsers, neither on --devapp serve. It will work fine, but it isn't taking the options object... I need it to return base64 (outputType: 1), but always returns fileURI
/*Imports section*/
declare const window: any;
#Component({...})
export class HomePage implements OnInit {
constructor(){}
yourMethod() {
window.imagePicker.getPictures(
async function(results) {
for (var i = 0; i < results.length; i++) {
const currentPicture = results[i];
files.push(currentPicture);
}
console.log(files);
}, function (error) {
console.log('Error: ' + error);
},
{
outputType: 1,
maximumImagesCount: 30,
quality: 100
}
);
}
}

sass: node_modules/ionic-angular/themes/ionic.functions.scss

Error while ionic cordova build
sass: node_modules/ionic-angular/themes/ionic.functions.scss
Full Error:
[11:34:50] sass started ...
[11:34:51] sass: node_modules/ionic-angular/themes/ionic.functions.scss, line: 35
The map color `contentbg` is not defined. Please make sure the color exists in your `$colors` map. For
example: $colors: ( contentbg: #327eff );
L35: #error $error-msg;
[11:34:51] ionic-app-script task: "build"
[11:34:51] Error: Failed to render sass to css
Error: Failed to render sass to css
at new BuildError (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/#ionic/app-scripts/dist/util/errors.js:16:28)
at Object.callback (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/#ionic/app-scripts/dist/sass.js:210:24)
at options.error (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/node-sass/lib/index.js:294:32)
[ERROR] An error occurred while running subprocess ionic-app-scripts.
ionic-app-scripts build --target cordova --platform android exited with exit code 1.
Re-running this command with the --verbose flag may provide more information.
// package.json
This is my package.json
{
"name": "ionic-firebase-cart",
"version": "0.0.1",
"author": "IonicThemes",
"homepage": "https://ionicthemes.com/",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
"#angular/animations": "5.2.10",
"#angular/common": "5.2.10",
"#angular/compiler": "5.2.10",
"#angular/compiler-cli": "5.2.10",
"#angular/core": "5.2.10",
"#angular/forms": "5.2.10",
"#angular/http": "5.2.10",
"#angular/platform-browser": "5.2.10",
"#angular/platform-browser-dynamic": "5.2.10",
"#ionic-native/core": "4.4.0",
"#ionic-native/facebook": "^4.20.0",
"#ionic-native/google-plus": "^4.20.0",
"#ionic-native/splash-screen": "4.4.0",
"#ionic-native/status-bar": "4.4.0",
"#ionic-native/twitter-connect": "^4.20.0",
"#ionic-native/vibration": "^5.3.0",
"#ionic/storage": "2.1.3",
"angular2-tag-input": "^1.2.3",
"angularfire2": "^5.1.2",
"cordova-android": "6.4.0",
"cordova-ios": "^4.5.5",
"cordova-plugin-browsertab": "0.2.0",
"cordova-plugin-buildinfo": "2.0.2",
"cordova-plugin-compat": "1.2.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-facebook4": "^1.10.1",
"cordova-plugin-googleplus": "^5.3.2",
"cordova-plugin-inappbrowser": "3.0.0",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-ionic-webview": "^1.2.1",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-vibration": "^3.1.0",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-universal-links-plugin": "~1.2.1",
"cordova-universal-links-plugin-fix": "1.2.1",
"firebase": "^5.9.2",
"ionic-angular": "3.9.2",
"ionic-native": "^2.9.0",
"ionicons": "3.0.0",
"promise-polyfill": "8.1.0",
"rxfire": "^3.3.5",
"rxjs": "6.3.3",
"rxjs-compat": "6.3.3",
"sw-toolbox": "3.6.0",
"twitter-connect-plugin": "git+https://github.com/chroa/twitter-connect-plugin.git",
"zone.js": "0.8.18"
},
"devDependencies": {
"#ionic/app-scripts": "^3.2.3",
"#ionic/lab": "1.0.15",
"typescript": "2.4.2"
},
"description": "An Ionic project",
"cordova": {
"platforms": [
"ios",
"android"
],
"plugins": {
"cordova-plugin-device": {},
"cordova-plugin-facebook4": {
"APP_ID": "186848361921511",
"APP_NAME": "myApplication"
},
"cordova-plugin-googleplus": {
"REVERSED_CLIENT_ID": "com.googleusercontent.apps.1054364409223-ce6upclbeq8pmhkn4"
},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-ionic-webview": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-whitelist": {},
"twitter-connect-plugin": {
"FABRIC_KEY": "dbf48d8f78bb37d7792891eb24607",
"TWITTER_KEY": "kMV673U1X4CduYL",
"TWITTER_SECRET": "mb03DWehE5zRcb4g6Yl3tORCNy503rc4"
},
"cordova-plugin-buildinfo": {},
"cordova-universal-links-plugin": {},
"cordova-plugin-browsertab": {},
"cordova-plugin-inappbrowser": {}
}
}
}
//
** And After this below Error**
Error: Failed to render sass to css
at new BuildError (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/#ionic/app-scripts/dist/util/errors.js:16:28)
at Object.callback (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/#ionic/app-scripts/dist/sass.js:210:24)
at options.error
Getting errors this
(/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/node-sass/lib/index.js:294:32)
[ERROR] An error occurred while running subprocess ionic-app-scripts.

Somewhere in your your Sass files you specified contentbg as a color name,
If you meant it you should consider adding it to your $colors variable in src/theme/variables.scss
$colors: (
primary: #488aff,
secondary: #32db64,
danger: #f53d3d,
light: #f4f4f4,
contentbg: #21b8ff <<-------
);
Consider checking Ionic documentation about theming your app : https://ionicframework.com/docs/v3/theming/theming-your-app/

Failure INSTALL_PARSE_FAILED_MANIFEST_MALFORMED <provider> has empty authorities when running cordova app on Android

I've got a small Ionic android which was running just fine. After upgrading to Android 7.1 SDK, I get the following error when running cordova run --target=emulator-5554 android --verbose:
Failure [INSTALL_PARSE_FAILED_MANIFEST_MALFORMED: Failed parse during installPackageLI: /data/app/vmdl444999769.tmp/base.apk (at Binary XML file line #103): <provider> has empty authorities attribute]
This is line 103 of platforms/android/app/build/intermediates/manifests/full/debug/AndroidManifest.xml:
<provider
android:name="com.marianhello.bgloc.sync.DummyContentProvider"
android:authorities="#string/content_authority"
android:exported="false"
android:syncable="true" />
It appears to me like the authorities attribute is defined, yet on some examples online I see that it has the app name in there while I have #string/content_authority instead. Unfortunately editing AndroidManifest.xml is worthless as it is generated.
Package.json:
{
"name": "travellogapp",
"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
"start": "ionic-app-scripts serve",
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"lint": "ionic-app-scripts lint"
},
"dependencies": {
"#angular/animations": "5.2.11",
"#angular/common": "5.2.11",
"#angular/compiler": "5.2.11",
"#angular/compiler-cli": "5.2.11",
"#angular/core": "5.2.11",
"#angular/forms": "5.2.11",
"#angular/http": "^6.1.10",
"#angular/platform-browser": "5.2.11",
"#angular/platform-browser-dynamic": "5.2.11",
"#ionic-native/background-geolocation": "^4.15.0",
"#ionic-native/core": "^4.15.0",
"#ionic-native/geolocation": "^4.15.0",
"#ionic-native/google-maps": "^4.14.0",
"#ionic-native/splash-screen": "~4.15.0",
"#ionic-native/status-bar": "~4.15.0",
"#ionic/storage": "2.2.0",
"cordova-android": "^7.1.1",
"cordova-android-play-services-gradle-release": "^1.4.4",
"cordova-browser": "^5.0.4",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-geolocation": "^4.0.1",
"cordova-plugin-googlemaps": "^2.4.6",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-ionic-webview": "^2.2.0",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.26"
},
"devDependencies": {
"#ionic/app-scripts": "^3.2.0",
"typescript": "~2.6.2"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {
"ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-mauron85-background-geolocation": {
"ICON": "#mipmap/icon",
"SMALL_ICON": "#mipmap/icon",
"ACCOUNT_NAME": "#string/app_name",
"ACCOUNT_LABEL": "#string/app_name",
"ACCOUNT_TYPE": ".account",
"CONTENT_AUTHORITY": "",
"GOOGLE_PLAY_SERVICES_VERSION": "11+",
"ANDROID_SUPPORT_LIBRARY_VERSION": "23+"
},
"cordova-android-play-services-gradle-release": {
"PLAY_SERVICES_VERSION": "15.+"
},
"cordova-plugin-geolocation": {},
"cordova-plugin-googlemaps": {
"API_KEY_FOR_ANDROID": "XXX",
"API_KEY_FOR_IOS": "XXX",
"PLAY_SERVICES_VERSION": "15.0.1",
"ANDROID_SUPPORT_V4_VERSION": "27.+"
}
},
"platforms": [
"browser",
"android"
]
}
}

I've figured this out as soon as I wrote my question.
The provider tag was introduced by cordova-plugin-mauron85-background-geolocation. The line android:authorities="#string/content_authority" says that the authorities value is defined in a string (variable) called content_authority. You will find the variable defined in your config.xml and 'packgage.json':
"cordova-plugin-mauron85-background-geolocation": {
...
"CONTENT_AUTHORITY": ""
}
For some reason, it ended up being empty for me. Removing and adding the plugin fixed it by setting it to:
"cordova-plugin-mauron85-background-geolocation": {
...
"CONTENT_AUTHORITY": "$PACKAGE_NAME"
}