Ionic serve suddenly stopped working, attempts to update/downgrade plugins and CLI has no effect so far

Ionic Framework ionic-v3
1

Hey, everyone! I’m almost 3 months in with Ionic and I’ve ran into a problem that seemingly has no solution (I’m sure it does, but it’s been driving me insane for the past days looking for solutions in different forums!) This is my first post so feel free to point out some errors about my post. Thanks!

I’ve built a couple of apps before and it all worked flawlessly. I ran into this one out of nowhere when trying to test one of my apps. It wasn’t newly opened, I was in the middle of the usual change-and-serve routine.

Whenever I run ionic serve, the terminal displays the usual logs:

Starting app-scripts server: --address 0.0.0.0
–port 8100 --livereload-port 35729 --dev-logger-port 53703 --nobrowser -
Ctrl+C to cancel
[10:52:15] watch started …
[10:52:15] build dev started …

When I run ionic serve --verbose, it shows this.

[DEBUG] CLI flags: { interactive: true, confirm: false }
[DEBUG] { cwd: ‘C:\Users\reign.mina\Desktop\IonicSearchDemo\ionic-search’, local: true, binPath:
‘C:\Users\reign.mina\AppData\Roaming\npm\node_modules\ionic\bin\ionic’, libPath:
‘C:\Users\reign.mina\Desktop\IonicSearchDemo\ionic-search\node_modules\ionic\dist\index.js’ }
[DEBUG] Daemon found (pid: 4988)
Starting app-scripts server: --address 0.0.0.0 --port 8100 --livereload-port 35729 --dev-logger-port 53703 --nobrowser -
Ctrl+C to cancel
[10:05:19] watch started …
[10:05:19] build dev started …

The Error
When I try to load localhost:8100 in any browser, it results to nothing. Literally nothing, not even errors or anything. It just loads for a while and stops.

Different error results in each browser
Internet Explorer: localhost has stopped due to a long running script.
Chrome: (Nothing. It just keeps loading and stops after several minutes to show “Aw, Snap!” page.)
Firefox: (Nothing again, stuck on transferring data from localhost)

Out of all the browsers I’ve tried it on, only Explorer actually stops loading after a short while.

I’ve tried solutions that other similar forum posts presented, namely these ones:

At one point, the terminal asked me if I wanted to update the local Ionic CLI
(3.19.1 => 3.20.0)

I tried both Y/N options. After updating my local CLI using this command
npm i -D -E ionic@latest
The problem persists. After downgrading once more, it still persists.
npm i --save -E ionic@3.19.1

If I run ionic cordova prepare (as suggested in another post), it shows this

Running app-scripts build: --target cordova
[10:51:13] build dev started …
[10:51:13] clean started …
[10:51:13] clean finished in 40 ms
[10:51:13] copy started …
[10:51:13] deeplinks started …
[10:51:13] deeplinks finished in 64 ms
[10:51:13] transpile started …
[10:51:21] transpile finished in 8.02 s
[10:51:21] preprocess started …
[10:51:21] preprocess finished in less than 1 ms
[10:51:21] webpack started …
[10:51:21] copy finished in 8.58 s
[10:51:29] webpack finished in 7.79 s
[10:51:29] sass started …
Without from option PostCSS could generate wrong source map and will not find Browserslist config. Set it to CSS file path or to undefined to prevent this warning.
[10:51:30] sass finished in 1.57 s
[10:51:30] postprocess started …
[10:51:31] postprocess finished in 28 ms
[10:51:31] lint started …
[10:51:31] build dev finished in 18.03 s
cordova prepare
Android Studio project detected

[10:51:39] lint finished in 8.52 s`

Even when generating a new starter Ionic template project (blank, sidemenu, tutorial, etc.) the same problem persists even with previously working projects that I have already built an apk on. This makes me feel like it’s a problem with my PC or file directories, I just don’t know what to look into without ruining it more.

ionic info

cli packages: (C:\Users\reign.mina\Desktop\IonicSearchDemo\ionic-search\node_modules)

@ionic/cli-utils  : 1.19.2
ionic (Ionic CLI) : 3.20.0

global packages:

cordova (Cordova CLI) : 8.0.0

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : android 7.0.0
Ionic Framework    : ionic-angular 3.9.2

System:

Node : v9.4.0
npm  : 5.7.1
OS   : Windows 10

Environment Variables:

ANDROID_HOME : not set

Misc:

backend : pro

I’m really lost with this one. I’ve found solutions to all my Ionic problems by going through posts and this is the first time I’ve been truly lost. All help will be appreciated. Thanks!

1 Like
2

A.

does this happens with blank new project too? not sure I did unterstand

if not, have you try reinstalling the libs? you are on a pc right?

  1. delete folder node_modules
  2. delete package-lock.json (too force a resync of the libs)
  3. npm install

B.

when you see a blank screen in chrome, do you also see nothing in the debugger console or do you see any error?

C.

is your project an open source project? If so, if you want, I could clone it on my machine an try to run it to see if the problem may be linked to the machine or to the project itself.

1 Like
3

A.
Yes, this also happens on newly generated blank projects. Also on other Starter Ionic projects and my past projects that I already turned to apk.

I haven’t tried reinstalling the libraries yet but I’ll follow your steps to see if it will work.

B.
Yup, completely nothing in the debugger or any console. It just loads for several minutes and stops.

image
image.png1920×1080 100 KB

C.
Yes, it is open source. Sure, we could do that. I’ll reinstall the libs first as you suggested and if it still doesn’t work I’ll create a repo for my project.

Thanks for your help! :slight_smile:

4

That’s really weird

C.

Sure let me know I will give a try

5

I just ran locally ionic serve, you are right a all piece of logs are missing in your logs

[07:38:40]  build dev finished in 31.86 s 
[07:38:40]  watch ready in 32.03 s 
[07:38:40]  dev server running: http://localhost:8100/ 

[OK] Development server running!
     Local: http://localhost:8100
     External: http://...:8100
     DevApp: myproject@8100 on my-latop

[07:38:49]  lint finished in 9.27 s

you know what, is it possible that the script face a network problem on your laptop and therefore it hangs? have you try running your project without devapp?

ionic serve --no-devapp

or maybe is even the port 8100 busy? trying another port?

ionic serve --port 8564

Ref.: https://ionicframework.com/docs/cli/serve/

6

Hi, I just globally updated all my npm and ionic to @latest. Now any new projects I make are working. However the same problem still persists on the app I was having the problem on. I already tried to delete the npm_modules (took very long, lol) and package-lock.json then reinstalled he npm… same problem.

I also ran ionic seve with no devapp and different port like you suggested but the problem is still the same. Here is the link to a git repo I just made

Thank you!

7

Look like you definitely have a local problem aka not related to this particular project

I did (I’m on a mac)

git clone https://github.com/reignmina/IonicSearchDemo
cd IonicSearchDemo/
npm install
ionic serve

and everything went fine

you are on a pc right? have you try restart it (I don’t trust these :wink: )? maybe a port is frozen or something…

otherwise do you have your project in a subfolder called “test”? not with Ionic but with Stencil for a test lib I once faced issue because my project was in a subfolder called like this

8

Yeah I’ve restarted it countless of times since two days ago but to no avail. :frowning: When I try to run new apps on the same port it runs well.

About the Stencil, I am unfamiliar with that. My project is located under a folder called “IonicSearchDemo” which is under Desktop. Does that have the same effect?

Path - C:\Users\reign.mina\Desktop\IonicSearchDemo\ionic-search

9

Could you try:

ionic serve --local

this will run without external network usage

otherwise I’m slowly out of idea. I notice that you say

Path - C:\Users\reign.mina\Desktop\IonicSearchDemo\ionic-search

that’s the root? isn’t the root the following?

Path - C:\Users\reign.mina\Desktop\IonicSearchDemo\
10

Yes, it’s the root. I tried to move my folder out of IonicSearchDemo\ but it persists. I also ran it without external network usage but still the problem persists. This is driving me crazy, I have no idea what this is. I’ll try to redo my project with the same plugins and check if it works.

11

If all other projects which are working from scratch are working, that might be a good idea.

That’s so weird really I had no problem running your project…

Hope this will work

12

I know right, this is the weirdest problem I’ve ever encountered haha. I’ll check on this again tomorrow and I’ll update this thread if it starts to work.

Thanks again, Mr. Fantastic! :smiley:

1 Like
13

Good luck, keep us posted

1 Like
14

I had a similar issue - and I just ran

sudo npm i -g ionic@latest

and the inclusion of sudo must have allowed certain permissions that the CLI couldn’t access - it removed 4 certain packages during the update and then it was properly updated thereafter.

1 Like
15

I was able to solve that by reinstalling npm. Old version was 5.8.0, new is 5.10.0, which now works.

16

FYI: You should be able to use npm without root access.