Skip to content
This repository has been archived by the owner on May 1, 2020. It is now read-only.

Ionic Serve with Codenvy livereload port mapping issue #1524

Open
doonfrs opened this issue Mar 15, 2019 · 1 comment
Open

Ionic Serve with Codenvy livereload port mapping issue #1524

doonfrs opened this issue Mar 15, 2019 · 1 comment

Comments

@doonfrs
Copy link

doonfrs commented Mar 15, 2019

Short description of the problem:

Codenvy/Eclipse che does not expose the same port being used by the application.
They provide a feature called 'server' so you can provide the listening port, then you will get a random port for external workspace access.
Now we can use ionic serve --livereload-port 8001 --port 8002
and map the ports 8001, 8002 in codenvy servers tab to get new ports.
All will works fine except ionic serve will write the liver reload port in the produced index.html file.
ionic run browser will works fine using new port like http://*IP:32233 instead of http://*IP:8000
ionic run browser -l --livereload-port 8002 will failed because the port 8002 (for ex) is written in the index.html file and script will get timeout for not being able to access a port, live reload will fail.

What behavior are you expecting?

Being able to specify an alias port for livereload or being able to provide the live reload url.
I tried --livereload-url but it does not seems to be designed for this scenario, passing this variable will ignore the rest of variables like --port and will run the script without building.

Steps to reproduce:

  1. Create Codenvy workspace
  2. Add servers for ports 8002 , 8003 , 8004
  3. ionic serve --port 8002 --dev-logger-port 8003 --livereload-port 8004
  4. Access the served url with new port provided by codenvy server (http://IP:32323)
  5. Page keep waiting and network timeout for accessing http://IP:8004 url (live reload) while the exposed port will be http://IP:32324 (for ex.)
ionic cordova run browser --livereload --port 8002 --dev-logger-port 8003 --livereload-port 8004 
Generated Script in index.html body:
<script src="//192.99.88.134:**8004**/livereload.js?snipver=1" async="" defer=""></script>

Which @ionic/app-scripts version are you using?
3.1.8

Other information: (e.g. stacktraces, related issues, suggestions how to fix, stackoverflow links, forum links, etc)
https://codenvy.com/docs/user-guide/previews/index.html

@doonfrs
Copy link
Author

doonfrs commented Mar 15, 2019

As fast solution, I inected the livereload URL in the index.html page body, so the generated one will failed, mine will work.

<!-- The following will fail to load-->
<script src="http://**IP**:32941/livereload.js"></script>

<!-- The following will success to load-->
<script src="http://**IP**:32941/livereload.js"></script>
</body>

The following code will be better (does not work in production)

<script>
    if(window.IonicDevServer)
    {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.async = true;
        script.onload = function(){
            // remote script has loaded
        };
        script.src = 'http://**IP**:32941/livereload.js';
        document.getElementsByTagName('head')[0].appendChild(script);        
    }
</script>

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant