Invalid link : 'page-name' when building with --prod


#1

I am using Ionic 3.

I am able to build and run the app without any problems using “ionic serve” or “ionic cordova run ios”.

However, When I build the app with --prod flag (ionic cordova run ios --prod), I get a white screen after the Splash Screen. I checked the console and found out the following error:

Error: Uncaught (in promise): invalid link: introduction-slides

IntroductionSlides page is the very first page that I set as the rootPage in app.component.ts.

I checked my IntroductionSlides page and made sure that I have the correct name for the page:

@IonicPage({
    name: "introduction-slides"
})

I also made sure that I have introduction-slides.module.ts file.

I have been having a real hard time trying to resolve this issue. It is an urgent matter and any help would be deeply appreciated. Please know that it all works fine except when run with --prod flag.

Note: Following are my devDependencies from package.json:

"devDependencies": {
    "@angular/cli": "^1.7.3",
    "@ionic/app-scripts": "^3.1.9",
    "@types/googlemaps": "^3.30.7",
    "ionic": "^3.20.0",
    "typescript": "^2.3.4",
    "ws": "3.3.2"
  }

Thank You.


#2

Try:

introduction.page.ts:

@IonicPage({
  name: 'IntroductionPage',   // must be the same as your class name
  segment: 'introduction'
})
@Component({
  selector: 'page-introduction',
  templateUrl: './introduction.page.html'
})
export class IntroductionPage {
  ...
}

app.component.ts:

public rootPage: any = 'IntroductionPage'; 

And a --prod build:

npm run build --prod
npm install http-server -g
http-server ./www

Then navigate to:

http://127.0.0.1:8080

And check the browser console.


#3

Hi, Thank you for responding.

I followed the exact steps that you mentioned.

I can still see the same error. No luck.


#4

What happens when you try scaffolding a new project?

ionic start myApp tabs
npm run build --prod
npm install http-server -g
http-server ./www

Then navigate to:

http://127.0.0.1:8080

And check the browser console.


#5

I tried what you suggested.

For some reason, the app just doesn’t load at all when I run it using http-server. It didn’t load when I was trying it for my actual app either.

The new starter app does load properly when I run it using ionic cordova run browser --prod.


#6

Wow! I just realized that the new app it created, is not even using Lazy-Loading at all by default. It is structured as an Ionic 2 app. What could be going on?


#7

What does the terminal say?

http-server ./www
Starting up http-server, serving ./www
Available on:
  http://127.0.0.1:8080
  http://192.168.1.115:8080
Hit CTRL-C to stop the server

Then navigate to:

http://127.0.0.1:8080

And check the browser console.


#8

The starter app is loading fine now for some reason.

The terminal says:

Starting up http-server, serving ./www
Available on:
  http://127.0.0.1:8080
  http://192.168.0.12:8080
Hit CTRL-C to stop the server

Navigating to http://localhost:8080 loads the app correctly in the browser.


#9

Doing the same for my actual app, still leads to the same Invalid Link error.

Here is what the terminal looks like:

Starting up http-server, serving ./www
Available on:
  http://127.0.0.1:8080
  http://192.168.0.12:8080
Hit CTRL-C to stop the server
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" Error (404): "Not found"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /cordova_plugins.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:39 GMT-0400 (EDT)] "GET /cordova_plugins.js" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /cordova_plugins.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /cordova_plugins.js" Error (404): "Not found"
[Mon May 21 2018 15:40:57 GMT-0400 (EDT)] "GET /assets/icon/favicon.ico" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:58 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:40:58 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" Error (404): "Not found"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" Error (404): "Not found"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:05 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:41:06 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:06 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:41:06 GMT-0400 (EDT)] "GET /cordova_plugins.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:06 GMT-0400 (EDT)] "GET /cordova_plugins.js" Error (404): "Not found"
[Mon May 21 2018 15:41:06 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/66.0.3359.181 Safari/537.36"
[Mon May 21 2018 15:41:06 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /build/main.css" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /cordova.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /web-animations.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /build/vendor.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /build/polyfills.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /assets/icons/flaticon.css" Error (404): "Not found"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /web-animations.min.js" Error (404): "Not found"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /build/js/es6-shim.min.js" Error (404): "Not found"
[Mon May 21 2018 15:42:20 GMT-0400 (EDT)] "GET /build/main.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:21 GMT-0400 (EDT)] "GET /assets/champagnelimousines-webfont.woff2" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:21 GMT-0400 (EDT)] "GET /cordova_plugins.js" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"
[Mon May 21 2018 15:42:21 GMT-0400 (EDT)] "GET /cordova_plugins.js" Error (404): "Not found"
[Mon May 21 2018 15:42:21 GMT-0400 (EDT)] "GET /assets/icon/favicon.ico" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5"