Issue with @ionic-native/network module

@silkski wrote:

Hi there,

I’ve been stuck at this issue with @ionic-native/network plugin for days and I’m unable to find a solution. I’m relatively new with Ionic, so excuse my code.

This is my Ionic info:

Ionic:

   Ionic CLI          : 5.2.6 (/usr/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.7.1
   @ionic/app-scripts : 3.2.4

Capacitor:

   Capacitor CLI   : not installed
   @capacitor/core : not installed

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.0.0, browser 6.0.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.0, (and 18 other plugins)

Utility:

   cordova-res : not installed
   native-run  : 0.2.8 

System:

   Android SDK Tools : 26.1.1 (/home/dimiftb/Android/Sdk)
   NodeJS            : v8.10.0 (/usr/bin/node)
   npm               : 6.9.0
   OS                : Linux 4.15

This is my package.json:

{
  "name": "test_location_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"
  },
  "dependencies": {
    "@angular/common": "4.4.3",
    "@angular/compiler": "4.4.3",
    "@angular/compiler-cli": "4.4.3",
    "@angular/core": "4.4.3",
    "@angular/forms": "4.4.3",
    "@angular/http": "4.4.3",
    "@angular/platform-browser": "4.4.3",
    "@angular/platform-browser-dynamic": "4.4.3",
    "@angular/router": "^4.4.3",
    "@ionic-native/background-mode": "^4.5.3",
    "@ionic-native/core": "4.3.2",
    "@ionic-native/date-picker": "^4.5.2",
    "@ionic-native/diagnostic": "^4.5.3",
    "@ionic-native/geolocation": "^4.20.0",
    "@ionic-native/insomnia": "^4.5.3",
    "@ionic-native/local-notifications": "^4.5.3",
    "@ionic-native/location-accuracy": "^4.5.3",
    "@ionic-native/media": "^5.8.0",
    "@ionic-native/native-geocoder": "^4.20.0",
    "@ionic-native/network": "^4.20.0",
    "@ionic-native/splash-screen": "4.3.2",
    "@ionic-native/status-bar": "4.3.2",
    "@ionic-native/stepcounter": "^4.5.2",
    "@ionic/storage": "2.0.1",
    "chart.js": "^2.7.1",
    "cordova-android": "8.0.0",
    "cordova-plugin-background-mode": "0.7.2",
    "cordova-plugin-badge": "^0.8.7",
    "cordova-plugin-datepicker": "^0.9.3",
    "cordova-plugin-device": "2.0.2",
    "cordova-plugin-geolocation": "4.0.1",
    "cordova-plugin-insomnia": "^4.3.0",
    "cordova-plugin-ionic-keyboard": "2.1.3",
    "cordova-plugin-ionic-webview": "4.1.0",
    "cordova-plugin-local-notification": "^0.9.0-beta.2",
    "cordova-plugin-nativegeocoder": "^2.0.4",
    "cordova-plugin-network-information": "^2.0.1",
    "cordova-plugin-request-location-accuracy": "2.3.0",
    "cordova-plugin-splashscreen": "5.0.2",
    "cordova-plugin-statusbar": "2.4.2",
    "cordova-plugin-stepcounter": "^1.0.1",
    "cordova-plugin-whitelist": "1.3.3",
    "cordova.plugins.diagnostic": "5.0.0",
    "ionic-angular": "3.7.1",
    "ionic-plugin-keyboard": "^2.2.1",
    "ionicons": "3.0.0",
    "rxjs": "^6.0.0",
    "rxjs-compat": "6.0.0",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.2.4",
    "typescript": "^2.1.0"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-device": {},
      "cordova-plugin-datepicker": {},
      "cordova-plugin-stepcounter": {},
      "cordova-plugin-nativegeocoder": {},
      "cordova-plugin-insomnia": {},
      "cordova-plugin-local-notification": {},
      "cordova-plugin-network-information": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-statusbar": {},
      "cordova-plugin-splashscreen": {},
      "cordova.plugins.diagnostic": {
        "ANDROID_SUPPORT_VERSION": "28.+"
      },
      "cordova-plugin-whitelist": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-background-mode": {},
      "cordova-plugin-request-location-accuracy": {
        "PLAY_SERVICES_LOCATION_VERSION": "16.+"
      },
      "cordova-plugin-geolocation": {},
      "cordova-plugin-advanced-http": {
        "OKHTTP_VERSION": "3.10.0"
      },
      "cordova-sqlite-storage": {},
      "cordova-plugin-networkinterface": {}
    },
    "platforms": [
      "android",
      "browser"
    ]
  }
}

I’ve imported the network module like this:

import {Network} from '@ionic-native/network';

The error I get is:

TS2749: 'Network' refers to a 'value', but it's being used as a 'type' here.

in
constructor(private network: Network, private toastController: ToastController, private plt: Platform)

Also when I adding the module to providers in app.module the error I get is:

TS2332: Type 'NetworkOriginal' is not assignable to type 'Provider'.

I read online that that’s due to the version of the package I’m using, so I tried to update to the latest version of @ionic-native/network as well and then import like this:

import {Network} from '@ionic-native/network/ngx';

That clears those errors and I can include it as a provider and also add it to constructor as a typeprivate network: Network, however when I try to use it like this:

this.network.onDisconnect().subscribe(() => {
            if (this.status.getValue() === ConnectionStatus.Online) {
                console.log('WE ARE OFFLINE');
                this.updateNetworkStatus(ConnectionStatus.Offline);
            }
        });

I get this error:

Error: Uncaught (in promise): TypeError: Object(...) is not a function
TypeError: Object(...) is not a function
    at Network.onDisconnect (http://localhost:8100/build/vendor.js:104490:126)
    at NetworkService.webpackJsonp.174.NetworkService.initializeNetworkEvents (http://localhost:8100/build/main.js:446:22)
    at http://localhost:8100/build/main.js:439:19
    at t.invoke (http://localhost:8100/build/polyfills.js:3:14356)
    at Object.onInvoke (http://localhost:8100/build/vendor.js:4373:33)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:14296)
    at r.run (http://localhost:8100/build/polyfills.js:3:9523)
    at http://localhost:8100/build/polyfills.js:3:19622
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:15040)
    at Object.onInvokeTask (http://localhost:8100/build/vendor.js:4364:33)
    at c (http://localhost:8100/build/polyfills.js:3:19132)
    at http://localhost:8100/build/polyfills.js:3:19653
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:15040)
    at Object.onInvokeTask (http://localhost:8100/build/vendor.js:4364:33)
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:14961)
    at r.runTask (http://localhost:8100/build/polyfills.js:3:10214)
    at o (http://localhost:8100/build/polyfills.js:3:7274)
    at e.invokeTask [as invoke] (http://localhost:8100/build/polyfills.js:3:16203)
    at p (http://localhost:8100/build/polyfills.js:2:26993)
    at HTMLDocument.v (http://localhost:8100/build/polyfills.js:2:27238)

I’m really not sure what to do. I appreciate your help.

Posts: 1

Participants: 1

Read full topic