IonicModule DeepLinkConfig... works in one app, but not the other


#1

I am beyond frustrated and confused on how the DeepLinkConfig works. There’s not much documentation for it.

I’ve been working on an app with over 70+ pages, 50+ components and 30+ providers for awhile now. One of the last features we need is Deeplinking. We are going to use the app as a PWA as well as a native app, so we need to be able to link users to specific pages while passing in params.

I found the ionic-conference-app. It works… pressing the back button in a browser worked, the view changed along with the URL… and going to a specific URL worked too. it loaded the correct tab at the correct page. Everything I wanted. This gave me hope.

I tried creating a new app, ionic start deeplinkTest tabs --cordova and setup a few links just to make sure I could replicate this:

IonicModule.forRoot(MyApp, {}, {
      links: [
        { component: TabsPage, name:'TabsPage', segment: 'tabs' },
        { component: AboutPage, name:'AboutPage', segment: 'about-page' },
        { component: ContactPage, name:'ContactPage', segment: 'contact-page' },
        { component: HomePage, name:'HomePage', segment: 'home-page' }
      ]
    })

This does not work.

Why?

I have scoured the ionic-conference-app looking for clues on how they get the deeplinks to work… I cannot find anything. I don’t get it. I am beyond frustrated. I’ve looked at countless forum threads and git issues with no real solution.

Does ANYONE know how this works and how I can get it to work like the ionic-conference-app?

If it helps, here is the deeplinkTest package… and my ionic info.

Tabs Starter package.json:

{
  "name": "deeplinkTest",
  "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": "5.0.1",
    "@angular/compiler": "5.0.1",
    "@angular/compiler-cli": "5.0.1",
    "@angular/core": "5.0.1",
    "@angular/forms": "5.0.1",
    "@angular/http": "5.0.1",
    "@angular/platform-browser": "5.0.1",
    "@angular/platform-browser-dynamic": "5.0.1",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic/storage": "2.1.3",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "rxjs": "5.5.2",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.2",
    "typescript": "2.4.2"
  },
  "description": "An Ionic project"
}

My Ionic Info:

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

    @ionic/cli-utils  : 1.18.0
    ionic (Ionic CLI) : 3.18.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.2
    Cordova Platforms  : none
    Ionic Framework    : ionic-angular 3.9.2

System:

    ios-deploy : 1.9.2
    ios-sim    : 5.0.6
    Node       : v8.9.1
    npm        : 5.5.1
    OS         : macOS Sierra
    Xcode      : Xcode 9.0 Build version 9A235

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : legacy

Has anyone actually deployed an Ionic app to the web?
#2

Anyone have any experience with other this?


#3

I’m using the deeplinks plugin (https://ionicframework.com/docs/native/deeplinks/) instead of the DeepLinker, which seems to work not too bad.