Ionic-cli: Live Reload is breaking every time there is a browser refresh

Created on 17 Apr 2017 · 7Comments · Source: ionic-team/ionic-cli

_From @tzsk on April 16, 2017 15:7_

Ionic version: (check one with "x")
[ ] 1.x
[ x ] 2.x
[ ] 3.x

I'm submitting a ... (check one with "x")
[ x ] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:

Whenever I do ionic serve inside the project folder it successfully starts up the live reload server, but then when I reload the page it stops the live server & also when I make any changes to the code and save it stops the live server with the same error when I refresh the window. So every time I make any changes I have to run ionic server again and again.

Expected behavior:

Live server should keep running. This is very bad development experience.

Steps to reproduce:

I don't know.

Related code:

The error output in the Command Line is:

<PROJECT ROOT>\node_modules\ws\lib\Receiver.js:306
  if (mask != null && buf != null) bufferUtil.unmask(buf, mask);
                                             ^

TypeError: Cannot read property 'unmask' of undefined
    at Receiver.unmask (<PROJECT ROOT>\node_modules\ws\lib\Receiver.js:306:46)
    at Receiver.finish (<PROJECT ROOT>\node_modules\ws\lib\Receiver.js:673:19)
    at Receiver.expectHandler (<PROJECT ROOT>\node_modules\ws\lib\Receiver.js:661:33)
    at Receiver.add (<PROJECT ROOT>\node_modules\ws\lib\Receiver.js:103:24)
    at Socket.realHandler (<PROJECT ROOT>\node_modules\ws\lib\WebSocket.js:825:20)
    at emitOne (events.js:96:13)
    at Socket.emit (events.js:188:7)
    at readableAddChunk (_stream_readable.js:176:18)
    at Socket.Readable.push (_stream_readable.js:134:10)
    at TCP.onread (net.js:548:20)

npm ERR! Windows_NT 10.0.14393
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "ionic:serve" "--" "--v2" "--address" "0.0.0.0" "--port" "8100" "--livereload-port" "35729"
npm ERR! node v6.9.1
npm ERR! npm  v3.10.8
npm ERR! code ELIFECYCLE
npm ERR! ionic-hello-world@ ionic:serve: `ionic-app-scripts serve "--v2" "--address" "0.0.0.0" "--port" "8100" "--livereload-port" "35729"`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the ionic-hello-world@ ionic:serve script 'ionic-app-scripts serve "--v2" "--address" "0.0.0.0" "--port" "8100" "--livereload-port" "35729"'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the ionic-hello-world package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     ionic-app-scripts serve "--v2" "--address" "0.0.0.0" "--port" "8100" "--livereload-port" "35729"
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs ionic-hello-world
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls ionic-hello-world
npm ERR! There is likely additional logging output above.

Other information:

I don't know.

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Cordova CLI: 6.5.0
Ionic Framework Version: 3.0.1
Ionic CLI Version: 2.2.2
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.9.1
Xcode version: Not installed

_Copied from original issue: driftyco/ionic#11237_

Source

jgw96

Most helpful comment

I updated ws to 1.1.4 inside app-scripts and it solved reloading problem.
cd ./node_modules/@ionic/app-scripts
npm install [email protected] -S

alllx on 20 Jul 2017

👍3 ❤1

All 7 comments

_From @ScreamZ on April 16, 2017 20:11_

enter in node_modules @ionic/app_script and update the ws package to 2.2.3 and run npm install ws.

Seems due to a old bug on ws package when multiple ws version are used in project
https://github.com/driftyco/ionic-app-scripts/issues/902

jgw96 on 17 Apr 2017

_From @tzsk on April 17, 2017 10:7_

Well, I have run the script npm install ws and it successfully updated the ws package to "version": "2.2.3", but now it won't even load the first time.

Previously it was loading the first time but was breaking the live reload in the 2nd refresh. Now it just runs and immediately breaks.

jgw96 on 17 Apr 2017

Same issue here, crashing on any file save or browser refresh. Error emitter is @ionic/app-scripts tho instead of node_modules/ws as above.

```js
/node_modules/@ionic/app-scripts/node_modules/ws/lib/Receiver.js:306
if (mask != null && buf != null) bufferUtil.unmask(buf, mask);
^

TypeError: Cannot read property 'unmask' of undefined
at Receiver.unmask (/node_modules/@ionic/app-scripts/node_modules/ws/lib/Receiver.js:306:46)
at Receiver.finish (/node_modules/@ionic/app-scripts/node_modules/ws/lib/Receiver.js:673:19)
at Receiver.expectHandler (/node_modules/@ionic/app-scripts/node_modules/ws/lib/Receiver.js:661:33)
at Receiver.add (/node_modules/@ionic/app-scripts/node_modules/ws/lib/Receiver.js:103:24)
at Socket.realHandler (/node_modules/@ionic/app-scripts/node_modules/ws/lib/WebSocket.js:825:20)
at emitOne (events.js:96:13)
at Socket.emit (events.js:188:7)
at readableAddChunk (_stream_readable.js:176:18)
at Socket.Readable.push (_stream_readable.js:134:10)
at TCP.onread (net.js:551:20)
`