Related
I am making an Ionic app and I want to integrate cordova plugin firebase. Unfortunately, this plugin is not maintained anymore so I use a fork: firebasex.
When running "ionic cordova run android", I get the following error:
BUILD FAILED in 43s
C:\[...]\platforms\android\gradlew: Command failed with exit code 1 Error output:
Note: C:\[...]\platforms\android\CordovaLib\src\org\apache\cordova\engine\SystemCookieManager.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
C:\[...]\platforms\android\app\src\main\java\org\apache\cordova\firebase\FirebasePlugin.java:405: error: cannot find symbol
boolean areNotificationsEnabled = notificationManagerCompat.areNotificationsEnabled();
^
symbol: method areNotificationsEnabled()
location: variable notificationManagerCompat of type NotificationManagerCompat
C:\[...]\platforms\android\app\src\main\java\org\apache\cordova\firebase\FirebasePluginMessagingService.java:204: error: constructor Builder in class Builder cannot be applied to given types;
NotificationCompat.Builder notificationBuilder = new NotificationCompat.Builder(this, channelId);
^
required: Context
found: FirebasePluginMessagingService,String
reason: actual and formal argument lists differ in length
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
2 errors
I have tried everything: removing and adding back android platform, use androidx, reinstalling modules etc etc.
Ionic info:
Ionic:
Ionic CLI : 5.2.3 (C:\Users\test\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : #ionic/angular 4.7.1
#angular-devkit/build-angular : 0.13.9
#angular-devkit/schematics : 7.3.9
#angular/cli : 7.3.9
#ionic/angular-toolkit : 1.5.1
Cordova:
Cordova CLI : 9.0.0 (cordova-lib#9.0.1)
Cordova Platforms : android 8.0.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.1, (and 16 other plugins)
Utility:
cordova-res : 0.6.0
native-run : 0.2.8
System:
Android SDK Tools : 26.1.1 (C:\[...]\AppData\Local\Android\Sdk)
NodeJS : v10.15.3 (C:\Program Files\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10
Cordova version:
9.0.0 (cordova-lib#9.0.1)
Package.json:
{
"name": "myapp",
"version": "1.0.0",
"author": "me",
"homepage": "page.com",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/common": "^7.2.2",
"#angular/core": "^7.2.2",
"#angular/forms": "^7.2.2",
"#angular/http": "^7.2.2",
"#angular/platform-browser": "^7.2.2",
"#angular/platform-browser-dynamic": "^7.2.2",
"#angular/router": "^7.2.2",
"#ionic-native/base64": "^5.9.0",
"#ionic-native/camera": "^5.9.0",
"#ionic-native/core": "^5.0.0",
"#ionic-native/file": "^5.10.0",
"#ionic-native/file-chooser": "^5.10.0",
"#ionic-native/file-picker": "^5.10.0",
"#ionic-native/file-transfer": "^5.9.0",
"#ionic-native/firebase": "^5.11.0",
"#ionic-native/http": "^5.9.0",
"#ionic-native/ionic-webview": "^5.11.0",
"#ionic-native/media-capture": "^5.0.0",
"#ionic-native/social-sharing": "^5.10.0",
"#ionic-native/splash-screen": "^5.0.0",
"#ionic-native/status-bar": "^5.0.0",
"#ionic-native/streaming-media": "^5.9.0",
"#ionic/angular": "^4.1.0",
"com-badrit-base64": "0.2.0",
"cordova-android": "^8.0.0",
"cordova-plugin-android-support-v4": "^21.0.1",
"cordova-plugin-androidx": "^1.0.2",
"cordova-plugin-androidx-adapter": "^1.1.0",
"cordova-plugin-camera": "^4.0.3",
"cordova-plugin-file": "6.0.1",
"cordova-plugin-file-transfer": "1.7.1",
"cordova-plugin-filechooser": "1.2.0",
"cordova-plugin-filepicker": "1.1.6",
"cordova-plugin-ionic-webview": "4.1.1",
"cordova-plugin-media-capture": "^3.0.3",
"cordova-plugin-streaming-media": "2.2.0",
"cordova-plugin-x-socialsharing": "5.4.7",
"cordova-support-android-plugin": "1.0.1",
"core-js": "^2.5.4",
"es6-promise-plugin": "4.2.2",
"rxjs": "~6.5.1",
"tslib": "^1.9.0",
"zone.js": "~0.8.29"
},
"devDependencies": {
"#angular-devkit/architect": "~0.13.8",
"#angular-devkit/build-angular": "~0.13.8",
"#angular-devkit/core": "~7.3.8",
"#angular-devkit/schematics": "~7.3.8",
"#angular/cli": "^7.3.9",
"#angular/compiler": "~7.2.2",
"#angular/compiler-cli": "~7.2.2",
"#angular/language-service": "~7.2.2",
"#ionic/angular-toolkit": "~1.5.1",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~12.0.0",
"codelyzer": "~4.5.0",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-whitelist": "^1.3.3",
"jasmine-core": "~2.99.1",
"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": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~8.3.0",
"tslint": "~5.17.0",
"typescript": "~3.1.6"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-file-transfer": {},
"cordova-plugin-camera": {},
"cordova-plugin-streaming-media": {},
"cordova-plugin-media-capture": {},
"com-badrit-base64": {},
"cordova-plugin-filechooser": {},
"cordova-plugin-filepicker": {},
"cordova-plugin-x-socialsharing": {},
"cordova-plugin-file": {},
"cordova-plugin-ionic-webview": {
"ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
},
"cordova-plugin-android-support-v4": {},
"cordova-plugin-androidx-adapter": {},
"cordova-plugin-androidx": {},
"cordova-plugin-firebasex": {}
},
"platforms": [
"android"
]
}
}
Thanks for helping me.
For clarity and people just like me searching 'firebase-x boolean areNotificationsEnabled = notificationManagerCompat.areNotificationsEnabled();', the answer is #mobiemp 's comment re android v4.
Simply remove it:
# ionic users
ionic cordova plugin remove cordova-plugin-android-support-v4
# cordova users
cordova plugin remove cordova-plugin-android-support-v4
cordova clean android; # flush it out
# then use your run command again, ie
ionic cordova run android -lc --address=0.0.0.0;
you need to remove firebase plugin if it is still there... also you need to update firebasex... it will fix the problem... if it isn't then trying removing some deprecated plugins you will able to find out in which plugin the problem exists...
it is the problem with the plugin the error message indicating that point. the similar problem exists with other plugins and update of the plugin and removing of the plugin fix the error...
here is the reference
i have a problem with my ionic 4 app. If I use ng serve or other commands as to one to build I have the following error. This error happens after a npm install. I think is related to some new versions of dependencies but I don't know which one.
Here my package.json:
{
"name": "example",
"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",
"run:ios": "ionic cordova run ios -l",
"run:browser": "ionic cordova run browser -l --live-reload",
"run:android": "ionic cordova emulate android -l",
"run:android_real_dev": "ionic cordova run android -l",
"build:ios:aot": "ionic cordova build ios --aot --minifyjs --minifycss --releas",
"build:ios:prod": "ionic cordova build ios --prod",
"build:browser:aot": "ionic cordova build browser --aot --minifyjs --minifycss --releas",
"build:android:aot": "ionic cordova build android --aot --minifyjs --minifycss --releas",
"build:android:prod": "ionic cordova build android --prod"
},
"private": true,
"dependencies": {
"#agm/core": "^1.0.0-beta.5",
"#angular/common": "^7.2.2",
"#angular/core": "^7.2.2",
"#angular/forms": "^7.2.2",
"#angular/http": "^7.2.2",
"#angular/platform-browser": "^7.2.2",
"#angular/platform-browser-dynamic": "^7.2.2",
"#angular/router": "^7.2.2",
"#ionic-native/call-number": "^5.2.0",
"#ionic-native/core": "^5.0.0",
"#ionic-native/dialogs": "^5.2.0",
"#ionic-native/file": "^5.3.0",
"#ionic-native/geolocation": "^5.2.0",
"#ionic-native/image-picker": "^5.2.0",
"#ionic-native/launch-navigator": "^5.2.0",
"#ionic-native/native-geocoder": "^5.2.0",
"#ionic-native/social-sharing": "^5.3.0",
"#ionic-native/splash-screen": "^5.0.0",
"#ionic-native/status-bar": "^5.0.0",
"#ionic/angular": "^4.1.0",
"#ionic/app-scripts": "^3.2.3",
"#ionic/storage": "^2.2.0",
"#ngx-translate/core": "^11.0.1",
"#ngx-translate/http-loader": "^4.0.0",
"agm-direction": "^0.7.6",
"balanced-match": "^1.0.0",
"call-number": "1.0.1",
"color": "^3.1.0",
"cordova-android": "8.0.0",
"cordova-browser": "5.0.4",
"cordova-ios": "5.0.1",
"cordova-plugin-actionsheet": "^2.3.3",
"cordova-plugin-add-swift-support": "1.7.2",
"cordova-plugin-device": "^2.0.2",
"cordova-plugin-dialogs": "2.0.1",
"cordova-plugin-file": "~6.0.1",
"cordova-plugin-geolocation": "4.0.1",
"cordova-plugin-ionic-keyboard": "^2.1.3",
"cordova-plugin-ionic-webview": "^3.1.2",
"cordova-plugin-nativegeocoder": "3.2.1",
"cordova-plugin-splashscreen": "^5.0.2",
"cordova-plugin-statusbar": "^2.4.2",
"cordova-plugin-telerik-imagepicker": "2.2.4",
"cordova-plugin-whitelist": "^1.3.3",
"cordova-plugin-x-socialsharing": "5.4.4",
"core-js": "^2.5.4",
"es6-promise-plugin": "4.2.2",
"hammerjs": "^2.0.8",
"ionic-cache": "^4.0.1",
"ionic-swipe-all": "^1.3.0",
"mx.ferreyra.callnumber": "~0.0.2",
"rxjs": "~6.3.3",
"uk.co.workingedge.phonegap.plugin.launchnavigator": "5.0.4",
"zone.js": "~0.8.29"
},
"devDependencies": {
"#angular-devkit/architect": "~0.12.3",
"#angular-devkit/build-angular": "~0.13.0",
"#angular-devkit/core": "~7.2.3",
"#angular-devkit/schematics": "~7.2.3",
"#angular/cli": "~7.3.1",
"#angular/compiler": "~7.2.2",
"#angular/compiler-cli": "~7.2.2",
"#angular/language-service": "~7.2.2",
"#ionic/angular-toolkit": "~1.4.0",
"#types/color": "^3.0.0",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~10.12.0",
"codelyzer": "~4.5.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~3.1.4",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~8.0.0",
"tslint": "~5.12.0",
"typescript": "~3.1.6"
},
"description": "A Custom Listing App project",
"cordova": {
"plugins": {
"cordova-plugin-whitelist": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-ionic-webview": {},
"cordova-plugin-ionic-keyboard": {},
"cordova-plugin-dialogs": {},
"mx.ferreyra.callnumber": {},
"uk.co.workingedge.phonegap.plugin.launchnavigator": {
"GOOGLE_API_KEY_FOR_ANDROID": "...",
"LOCATION_USAGE_DESCRIPTION": "This app requires access to your location for navigation purposes",
"OKHTTP_VERSION": "3.12.0"
},
"cordova-plugin-telerik-imagepicker": {
"PHOTO_LIBRARY_USAGE_DESCRIPTION": " "
},
"cordova-plugin-geolocation": {},
"cordova-plugin-nativegeocoder": {
"LOCATION_WHEN_IN_USE_DESCRIPTION": "Use geocoder service"
},
"cordova-plugin-x-socialsharing": {
"ANDROID_SUPPORT_V4_VERSION": "24.1.1+"
},
"cordova-plugin-file": {}
},
"platforms": [
"browser",
"android",
"ios"
]
}
}
And the error is:
Cannot destructure property `createHash` of 'undefined' or 'null'.
TypeError: Cannot destructure property `createHash` of 'undefined' or 'null'.
at Object.<anonymous> (/Users/asd/WebstormProjects/customlistingapp/node_modules/mini-css-extract-plugin/dist/index.js:21:5)
at Module._compile (internal/modules/cjs/loader.js:702:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
at Function.Module._load (internal/modules/cjs/loader.js:543:3)
at Module.require (internal/modules/cjs/loader.js:650:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (/Users/asd/WebstormProjects/customlistingapp/node_modules/mini-css-extract-plugin/dist/cjs.js:3:18)
at Module._compile (internal/modules/cjs/loader.js:702:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
at Function.Module._load (internal/modules/cjs/loader.js:543:3)
at Module.require (internal/modules/cjs/loader.js:650:17)
at require (internal/modules/cjs/helpers.js:20:18)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! example#0.0.1 start: `ng serve`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the example#0.0.1 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/asd/.npm/_logs/2019-04-30T10_34_47_445Z-debug.log
I tried to install webpack or the plugin asked locally but the error is the next one. I don't know what to do because I can't run my app neither build it.
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration has an unknown property 'optimization'. These properties are valid:
object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, parallelism?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? }
For typos: please correct them.
For loader options: webpack 2 no longer allows custom properties in configuration.
Loaders should be updated to allow passing options via loader options in module.rules.
Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
plugins: [
new webpack.LoaderOptionsPlugin({
// test: /\.xxx$/, // may apply this only for some modules
options: {
optimization: ...
}
})
]
- configuration.output has an unknown property 'futureEmitAssets'. These properties are valid:
object { auxiliaryComment?, chunkFilename?, crossOriginLoading?, jsonpScriptType?, chunkLoadTimeout?, devtoolFallbackModuleFilenameTemplate?, devtoolLineToLine?, devtoolModuleFilenameTemplate?, filename?, hashDigest?, hashDigestLength?, hashFunction?, hashSalt?, hotUpdateChunkFilename?, hotUpdateFunction?, hotUpdateMainFilename?, jsonpFunction?, library?, libraryTarget?, libraryExport?, path?, pathinfo?, publicPath?, sourceMapFilename?, sourcePrefix?, strictModuleExceptionHandling?, umdNamedDefine? }
-> Options affecting the output of the compilation. `output` options tell webpack how to write the compiled files to disk.
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration has an unknown property 'optimization'. These properties are valid:
object { amd?, bail?, cache?, context?, dependencies?, devServer?, devtool?, entry, externals?, loader?, module?, name?, node?, output?, parallelism?, performance?, plugins?, profile?, recordsInputPath?, recordsOutputPath?, recordsPath?, resolve?, resolveLoader?, stats?, target?, watch?, watchOptions? }
For typos: please correct them.
For loader options: webpack 2 no longer allows custom properties in configuration.
Loaders should be updated to allow passing options via loader options in module.rules.
Until loaders are updated one can use the LoaderOptionsPlugin to pass these options to the loader:
plugins: [
new webpack.LoaderOptionsPlugin({
// test: /\.xxx$/, // may apply this only for some modules
options: {
optimization: ...
}
})
]
- configuration.output has an unknown property 'futureEmitAssets'. These properties are valid:
object { auxiliaryComment?, chunkFilename?, crossOriginLoading?, jsonpScriptType?, chunkLoadTimeout?, devtoolFallbackModuleFilenameTemplate?, devtoolLineToLine?, devtoolModuleFilenameTemplate?, filename?, hashDigest?, hashDigestLength?, hashFunction?, hashSalt?, hotUpdateChunkFilename?, hotUpdateFunction?, hotUpdateMainFilename?, jsonpFunction?, library?, libraryTarget?, libraryExport?, path?, pathinfo?, publicPath?, sourceMapFilename?, sourcePrefix?, strictModuleExceptionHandling?, umdNamedDefine? }
-> Options affecting the output of the compilation. `output` options tell webpack how to write the compiled files to disk.
at webpack (/Users/asd/WebstormProjects/customlistingapp/node_modules/webpack/lib/webpack.js:19:9)
at WebpackBuilder.createWebpackCompiler (/Users/asd/WebstormProjects/customlistingapp/node_modules/#angular-devkit/build-webpack/src/webpack/index.js:20:16)
at Observable.rxjs_1.Observable.obs [as _subscribe] (/Users/asd/WebstormProjects/customlistingapp/node_modules/#angular-devkit/build-webpack/src/webpack/index.js:24:42)
at Observable._trySubscribe (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/Observable.js:44:25)
at Observable.subscribe (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/Observable.js:30:22)
at /Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/util/subscribeTo.js:22:31
at Object.subscribeToResult (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/util/subscribeToResult.js:10:45)
at MergeMapSubscriber._innerSub (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/operators/mergeMap.js:82:29)
at MergeMapSubscriber._tryNext (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/operators/mergeMap.js:76:14)
at MergeMapSubscriber._next (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/operators/mergeMap.js:59:18)
at MergeMapSubscriber.Subscriber.next (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/Subscriber.js:67:18)
at MergeMapSubscriber.notifyNext (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/operators/mergeMap.js:92:26)
at InnerSubscriber._next (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/InnerSubscriber.js:28:21)
at InnerSubscriber.Subscriber.next (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/Subscriber.js:67:18)
at MergeMapSubscriber.notifyNext (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/operators/mergeMap.js:92:26)
at InnerSubscriber._next (/Users/asd/WebstormProjects/customlistingapp/node_modules/rxjs/internal/InnerSubscriber.js:28:21)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! example#0.0.1 build: `ng build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the example#0.0.1 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/asd/.npm/_logs/2019-04-30T10_27_10_155Z-debug.log
I'm trying to migrate a project I made with ionic 2 last year, to ionic 3.9.
I'm having troubles with the ionic-native sqlite.
I updated my CLI and I did the steps mentionned here to update : https://forum.ionicframework.com/t/guide-how-to-update-to-ionic-3-x/87516
I think I did what was mentionned in the documentation. I added this import in the app.module.ts file :
import { SQLite, SQLiteObject } from '#ionic-native/sqlite';
And I added the 2 objects in the providers entry of the NgModule :
#NgModule({
// ...
providers: [
StatusBar,
SplashScreen,
SQLite, SQLiteObject,
{ provide: ErrorHandler, useClass: IonicErrorHandler }
]
})
Also, I have 1 class that included the sqlite object, and I replace the previous with this :
import { SQLite, SQLiteObject } from '#ionic-native/sqlite';
The previous import was :
import { SQLite } from 'ionic-native';
Unfortunately, when I try to build with ionic cordova build android, i get :
// ...
[18:34:51] preprocess finished in 1 ms
[18:34:51] webpack started ...
[18:34:54] copy finished in 10.43 s
[18:34:59] ionic-app-script task: "build"
[18:34:59] Error: ./src/pages/home/home.ts Module not found: Error: Can't resolve '#ionic-native/file' in
'/Users/julianlecalvez/Documents/SFR/biometo-v4/src/pages/home' resolve '#ionic-native/file' in
'/Users/julianlecalvez/Documents/SFR/biometo-v4/src/pages/home' Parsed request is a module using description
file: /Users/julianlecalvez/Documents/SFR/biometo-v4/package.json (relative path: ./src/pages/home) Field
'browser' doesn't contain a valid alias configuration after using description file:
/Users/julianlecalvez/Documents/SFR/biometo-v4/package.json (relative path: ./src/pages/home) resolve as
module looking for modules in /Users/julianlecalvez/Documents/SFR/biometo-v4/node_modules using description
file: /Users/julianlecalvez/Documents/SFR/biometo-v4/package.json (relative path: ./node_modules)
// I got the same errors for other native plugins (File & Google Analytics)
Here is my ionic info :
I
onic:
ionic (Ionic CLI) : 4.3.1 (/usr/local/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.2
#ionic/app-scripts : 3.2.0
Cordova:
cordova (Cordova CLI) : 8.1.2 (cordova-lib#8.1.1)
Cordova Platforms : android 6.0.0, ios 4.3.1
Cordova Plugins : no whitelisted plugins (11 plugins total)
System:
Android SDK Tools : 25.1.3 (/Users/julianlecalvez/Library/Android/sdk/)
ios-deploy : 1.9.1
NodeJS : v8.9.1 (/usr/local/bin/node)
npm : 5.5.1
OS : macOS High Sierra
And here is my package.json :
{
"name": "xxx",
"author": "xxx",
"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": "5.2.11",
"#angular/platform-browser": "5.2.11",
"#angular/platform-browser-dynamic": "5.2.11",
"#ionic-native/core": "~4.15.0",
"#ionic-native/splash-screen": "~4.15.0",
"#ionic-native/status-bar": "~4.15.0",
"#ionic/storage": "2.2.0",
"ionic-angular": "3.9.2",
"ionicons": "3.0.0",
"rxjs": "5.5.11",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.26",
"#types/hammerjs": "^2.0.34",
"cordova-android": "7.1.1",
"cordova-plugin-device": "^2.0.2",
"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",
"cordova-sqlite-storage": "2.5.1",
"prismic.io": "^3.3.0"
},
"devDependencies": {
"#ionic/app-scripts": "^3.2.0",
"typescript": "~2.6.2"
},
"cordovaPlugins": [
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-whitelist",
"cordova-plugin-console",
"ionic-plugin-keyboard",
"cordova-plugin-splashscreen"
],
"cordovaPlatforms": [
"ios",
{
"platform": "ios",
"version": "",
"locator": "ios"
}
],
"description": "xxx",
"cordova": {
"plugins": {
"cordova-plugin-splashscreen": {},
"cordova-plugin-statusbar": {},
"cordova-sqlite-storage": {}
}
}
}
when you install ionic plugin ,if you don't appoint version, it will install the latest version. but the latest version is for ionic4, so you can't use it in ionic3, so you must install #ionic-native pulgin by appoint version.
see plugin docs of ionic3 not ionic4 or 5.
I am attempting to add the Geolocation Ionic native plugin to my Ionic 2.0 application.
As per the instructions here, I have imported the geolocation plugin and I am attempting to add it to the ‘providers’ array on my AppModule decorator, but I am getting a syntax error:
import { Geolocation } from '#ionic-native/geolocation';
...
#NgModule({
declarations: [
MyApp,
BasketPage,
AccountPage,
AccountCreationPage,
CategoriesPage,
TabsPage,
LandingPage,
CategoryPage,
ProductPage
],
imports: [
IonicModule.forRoot(MyApp),
HttpModule
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
BasketPage,
AccountPage,
AccountCreationPage,
CategoriesPage,
TabsPage,
LandingPage,
CategoryPage,
ProductPage
],
providers: [
Geolocation,
{ provide: ErrorHandler, useClass: IonicErrorHandler }
]
})
export class AppModule {}
The providers array seems to only accept an object with the ‘provide’ and ‘useClass’ properties, so adding the Geolocation object didn’t work.
Also, if you check the Ionic documentation, the providers array looks different to mine? Why is that? When I checked the Ionic documentation, there are only two versions - v1 and ‘latest’.
What am I doing wrong here?
The error message I get when the task runner is building the app is as follows (although Visual Studio highlights in red the syntax error anyway):
12:56:37] typescript:
…rce/Repos/Aise/Aise/AiseMobile/node_modules/#ionic-native/geolocation/index.d.ts,
line: 127 Type ‘any’ is not a constructor function type. L127: export
declare class Geolocation extends IonicNativePlugin {
For reference, here is the output from the ionic info command:
cli packages:
(C:\Users\ciara\Source\Repos\Aise\Aise\AiseMobile\node_modules)
#ionic/cli-utils : 1.9.2 ionic (Ionic CLI) : 3.9.2 global packages:
Cordova CLI : 7.0.1 local packages:
#ionic/app-scripts : 1.1.0 Cordova Platforms : android 6.2.3 Ionic
Framework : ionic-angular 2.0.1 System:
Android SDK Tools : 25.2.3 Node : v6.10.3 npm
: 3.10.10 OS : Windows 10
My package.json:
{
"name": "io.cordova.myappeaf9db",
"author": "",
"homepage": "",
"private": true,
"scripts": {
"clean": "ionic-app-scripts clean",
"build": "ionic-app-scripts build",
"ionic:build": "ionic-app-scripts build",
"ionic:serve": "ionic-app-scripts serve",
"watch": "ionic-app-scripts watch"
},
"dependencies": {
"#angular/common": "2.2.1",
"#angular/compiler": "2.2.1",
"#angular/compiler-cli": "2.2.1",
"#angular/core": "2.2.1",
"#angular/forms": "2.2.1",
"#angular/http": "2.2.1",
"#angular/platform-browser": "2.2.1",
"#angular/platform-browser-dynamic": "2.2.1",
"#angular/platform-server": "2.2.1",
"#ionic-native/geolocation": "^4.2.1",
"#ionic/storage": "1.1.7",
"cordova-android": "^6.2.3",
"cordova-plugin-compat": "^1.0.0",
"cordova-plugin-console": "1.0.5",
"cordova-plugin-device": "1.1.4",
"cordova-plugin-geolocation": "^2.4.3",
"cordova-plugin-splashscreen": "~4.0.1",
"cordova-plugin-statusbar": "2.2.1",
"cordova-plugin-whitelist": "1.3.1",
"ionic-angular": "2.0.1",
"ionic-native": "2.4.1",
"ionic-plugin-keyboard": "~2.2.1",
"ionicons": "3.0.0",
"jsonpath": "0.2.12",
"rxjs": "5.0.0-beta.12",
"sw-toolbox": "3.4.0",
"zone.js": "0.6.26"
},
"devDependencies": {
"#ionic/app-scripts": "1.1.0",
"#ionic/cli-plugin-ionic-angular": "1.2.0",
"typescript": "2.0.9"
},
"description": "Ionic2Tabs: An Ionic project",
"cordovaPlugins": [
"cordova-plugin-whitelist",
"cordova-plugin-console",
"cordova-plugin-statusbar",
"cordova-plugin-device",
"cordova-plugin-splashscreen",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [],
"-vs-binding": {
"BeforeBuild": [
"ionic:build"
],
"ProjectOpened": [
"watch"
]
},
"cordova": {
"plugins": {
"cordova-plugin-console": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-whitelist": {},
"ionic-plugin-keyboard": {},
"cordova-plugin-geolocation": {}
},
"platforms": [
"android"
]
}
}
If you plan on using ionic-native 2.x, you dont need to install ionic-native/<pluginName> package.
In the 2.x version all native plugin wrappers are included in the single core package. Also all plugin types are global and static.
In your case the usage is
import { Geolocation } from ionic-native // import
//To access the functions,
Geolocation.functionName()
You can uninstall the ionic-native/Geolocation package.
You also do not have to set provider in AppModule or inject in constructor.
---update 1---
It looks like a minimization issue for prod build.
I can reproduce the error by using ionic cordova build android --prod to create apk and adb install to push the apk to the android device.
The error message is:
main.js:1 ERROR Error: Uncaught (in promise): Error: No provider for t!
Error: No provider for t!
at Error (native)
at O (file:///android_asset/www/build/main.js:1:6087)
at T (file:///android_asset/www/build/main.js:1:6346)
at t._throwOrNull (file:///android_asset/www/build/main.js:3:5428)
at t._getByKeyDefault (file:///android_asset/www/build/main.js:3:5761)
at t._getByKey (file:///android_asset/www/build/main.js:3:5146)
at t.get (file:///android_asset/www/build/main.js:3:3554)
at e.get [as _Logger_81] (file:///android_asset/www/build/main.js:25:21486)
---main thread---
I have 3-line code behind a button. The code is attached at the end.
All 3-line functionality works as expected in ionic serve and ionic cordova run android in a real android device.
However, the 3rd line does not work if the code/apk is:
1. built by `ionic cordova build android --prod --release`,
2. published to google play store,
3. installed to the same android device.
It means that DubPage is not opened by clicking the button.
What I troubleshooted:
1. this.logger.log() does send data to logentries, i.e. `goToDub`
function is called succesfully.
2. this.player.pause() does stop the html5 video player
3. I have no idea how to debug `this.navCtrl.push()`.
4. The only possible cause I can come up with is the lazy loading of `DubPage`, even though I dont quite believe it being the reason.
Any hint?
goToDub() {
this.logger.log(JSON.stringify(this.video)); //send log to 3rd party cloud log service: logentries
this.player.pause(); // stop html5 video player video.js in the page
this.navCtrl.push("DubPage", { video: this.video }); // go to DubPage does NOT work in play store released apk version;
}
In addtion, my package.json
{
"name": "dubwork",
"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": "4.1.2",
"#angular/compiler": "4.1.2",
"#angular/compiler-cli": "4.1.2",
"#angular/core": "4.1.2",
"#angular/forms": "4.1.2",
"#angular/http": "4.1.2",
"#angular/platform-browser": "4.1.2",
"#angular/platform-browser-dynamic": "4.1.2",
"#ionic-native/camera": "3.10.2",
"#ionic-native/core": "3.10.2",
"#ionic-native/facebook": "^3.10.3",
"#ionic-native/file": "^3.10.3",
"#ionic-native/keyboard": "^3.10.3",
"#ionic-native/media": "^3.10.3",
"#ionic-native/splash-screen": "3.10.2",
"#ionic-native/status-bar": "3.10.2",
"#ionic-native/transfer": "^3.10.3",
"#ionic/storage": "2.0.1",
"angular2-logger": "^0.6.0",
"angularfire2": "^4.0.0-rc.1",
"cordova-android": "^6.2.3",
"cordova-plugin-compat": "^1.1.0",
"cordova-plugin-console": "^1.0.7",
"cordova-plugin-crosswalk-webview": "^2.3.0",
"cordova-plugin-device": "^1.1.6",
"cordova-plugin-facebook4": "^1.9.1",
"cordova-plugin-file": "^4.3.3",
"cordova-plugin-file-transfer": "^1.6.3",
"cordova-plugin-media": "^3.0.1",
"cordova-plugin-splashscreen": "^4.0.3",
"cordova-plugin-statusbar": "^2.2.3",
"cordova-plugin-whitelist": "^1.3.2",
"cordova-plugin-wkwebview-engine": "git+https://github.com/driftyco/cordova-plugin-wkwebview-engine.git",
"firebase": "^3.9.0",
"ionic-angular": "3.3.0",
"ionic-plugin-keyboard": "^2.2.1",
"ionicons": "3.0.0",
"rxjs": "5.1.1",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.11"
},
"devDependencies": {
"#ionic/app-scripts": "1.3.7",
"#ionic/cli-plugin-cordova": "1.4.0",
"#ionic/cli-plugin-ionic-angular": "1.3.1",
"typescript": "2.3.3"
},
"description": "An Ionic project",
"cordova": {
"plugins": {
"cordova-plugin-facebook4": {
"APP_ID": "229997797493525",
"APP_NAME": "dubLearn-mobile"
},
"cordova-plugin-console": {},
"cordova-plugin-device": {},
"cordova-plugin-splashscreen": {},
"cordova-plugin-statusbar": {},
"cordova-plugin-whitelist": {},
"ionic-plugin-keyboard": {},
"cordova-plugin-crosswalk-webview": {
"XWALK_VERSION": "23+",
"XWALK_LITEVERSION": "xwalk_core_library_canary:17+",
"XWALK_COMMANDLINE": "--disable-pull-to-refresh-effect",
"XWALK_MODE": "embedded",
"XWALK_MULTIPLEAPK": "true"
},
"cordova-plugin-wkwebview-engine": {},
"cordova-plugin-media": {},
"cordova-plugin-file-transfer": {}
},
"platforms": [
"android"
]
}
}
It turns out that the error was caused by using angular2-logger package alone. logentries is irrelevant.
Steps to reproduce the issue:
ionic start logger-bug blank
npm install --save angular2-logger
add angular2-logger package in app.module.ts provider
add angular2-logger package in home.ts and log a debug message
using ionic cordova run android, the app opens in android device without error
using ionic cordova run android --prod, the app shows promise t error