search

ionic-team / ionic-cli

The Ionic command-line interface
MIT License
2k stars 644 forks source link

Ionic v3 Live Reload not working #2306

Closed jgw96 closed 7 years ago

jgw96 commented 7 years ago

From @silverbackdan on May 17, 2017 12:7

Ionic version: (check one with "x") [ ] 1.x [ ] 2.x [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: While running ionic serve or ionic run <platform> -l no file changes trigger a reload or have any effect. (live reload not working). Are there any dependencies I need to make sure are installed myself or any way of outputting any logs on the files that should be being watched or running the watch command on it's own with a verbose output?

Expected behavior: Live reload should be working and enable updates to html/scss files etc. to be reflected without a rebuild.

Steps to reproduce: ionic serve or ionic run <platform> -l

Related code: N/A

Other information: Output when starting to run on the browser platform with livereload. It opens a browser on port 8000, I'm not sure if it should be 8100 - either way, neither port seems to update when scss files or html files are changed and saved.

$ ionic cordova run browser -l -c --verbose --address 192.168.1.101
[DEBUG] Load global plugin @ionic/cli-plugin-proxy
[DEBUG] Load local plugin @ionic/cli-plugin-cordova from ***/node_modules/@ionic/cli-plugin-cordova
[DEBUG] Load local plugin @ionic/cli-plugin-ionic-angular from ***/node_modules/@ionic/cli-plugin-ionic-angular
Starting app-scripts server: --livereload --l --consolelogs --c --address 192.168.1.101 --port 8100 --p 8100 --livereload-port 35729 --r 35729 --iscordovaserve --externalIpRequired --nobrowser - Ctrl+C to cancel
[14:18:24]  watch started ... 
[14:18:24]  build dev started ... 
[14:18:24]  clean started ... 
[14:18:24]  clean finished in 3 ms 
[14:18:24]  copy started ... 
[14:18:24]  transpile started ... 
[14:18:28]  transpile finished in 3.27 s 
[14:18:28]  preprocess started ... 
[14:18:28]  deeplinks started ... 
[14:18:28]  deeplinks finished in 89 ms 
[14:18:28]  preprocess finished in 89 ms 
[14:18:28]  webpack started ... 
[14:18:32]  copy finished in 7.65 s 
[14:18:36]  webpack finished in 8.47 s 
[14:18:36]  sass started ... 
[14:18:37]  sass finished in 1.06 s 
[14:18:37]  postprocess started ... 
[14:18:37]  postprocess finished in 9 ms 
[14:18:37]  lint started ... 
[14:18:38]  build dev finished in 13.09 s 
[14:18:38]  watch ready in 13.45 s 
[14:18:38]  dev server running: http://192.168.1.101:8100/ 

> cordova run browser
[14:18:40]  lint finished in 2.79 s 
Running command: ***platforms/browser/cordova/build 

Cleaning Browser project
Running command: ***/platforms/browser/cordova/run --nobuild

Static file server running @ http://localhost:8000/index.html
CTRL + C to shut down

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

global packages:

    @ionic/cli-utils : 1.1.2
    Cordova CLI      : 7.0.1 
    Ionic CLI        : 3.1.2

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.1.2
    @ionic/cli-plugin-ionic-angular : 1.1.2
    Ionic Framework                 : ionic-angular 3.2.1

System:

    Node       : v7.10.0
    OS         : macOS Sierra
    Xcode      : Xcode 8.3.2 Build version 8E2002 
    ios-deploy : 1.9.0 
    ios-sim    : 3.1.1

Copied from original issue: driftyco/ionic#11700

imhoffd commented 7 years ago

Consolidating to https://github.com/driftyco/ionic-cli/issues/2312

silverbackdan commented 7 years ago

Thanks @dwieeb but it is the same situation just using ionic serve - happy for it to be consolidated to the browser issue though if that's how you'd categorise it. Can you suggest any known workarounds to get live reload working that you know may be worth trying?

imhoffd commented 7 years ago

Ah, sorry @silverbackdan. I did not see that it wasn't working for you with ionic serve. Let's debug!

Can you show me the output of ionic serve ?

silverbackdan commented 7 years ago

Thanks! No worries, here is serve:

$ ionic serve --verbose
[DEBUG] Load global plugin @ionic/cli-plugin-proxy
[DEBUG] Load local plugin @ionic/cli-plugin-cordova from **/node_modules/@ionic/cli-plugin-cordova
[DEBUG] Load local plugin @ionic/cli-plugin-ionic-angular from **/node_modules/@ionic/cli-plugin-ionic-angular
[DEBUG] Checking for latest plugin version of ionic@latest.
"3.1.2"

[DEBUG] Latest version of ionic@latest is .
[DEBUG] Checking for latest plugin version of @ionic/cli-plugin-proxy@latest.
"1.1.2"

[DEBUG] Latest version of @ionic/cli-plugin-proxy@latest is .
[DEBUG] Checking for latest plugin version of @ionic/cli-plugin-cordova@latest.
"1.1.2"

[DEBUG] Latest version of @ionic/cli-plugin-cordova@latest is .
[DEBUG] Checking for latest plugin version of @ionic/cli-plugin-ionic-angular@latest.
"1.1.2"

[DEBUG] Latest version of @ionic/cli-plugin-ionic-angular@latest is .
Starting app-scripts server: --log-level debug --port 8100 --livereload-port 35729 --address 0.0.0.0 - Ctrl+C to cancel
[08:52:07]  watch started ... 
[08:52:07]  build dev started ... 
[08:52:07]  clean started ... 
[08:52:07]  clean finished in 5 ms 
[08:52:07]  copy started ... 
[08:52:07]  transpile started ... 
[08:52:11]  transpile finished in 3.73 s 
[08:52:11]  preprocess started ... 
[08:52:11]  deeplinks started ... 
[08:52:11]  deeplinks finished in 90 ms 
[08:52:11]  preprocess finished in 91 ms 
[08:52:11]  webpack started ... 
[08:52:16]  copy finished in 8.45 s 
[08:52:20]  webpack finished in 8.71 s 
[08:52:20]  sass started ... 
[08:52:21]  sass finished in 1.36 s 
[08:52:21]  postprocess started ... 
[08:52:21]  postprocess finished in 6 ms 
[08:52:21]  lint started ... 
[08:52:21]  build dev finished in 14.01 s 
[08:52:22]  watch ready in 14.30 s 
[08:52:22]  dev server running: http://localhost:8100/ 

[08:52:24]  lint finished in 2.51 s

Should I see anything log when a file changes? I can't see anything appear with any html, ts or scss file changes. I wonder if it's permissions on the files or if the files are never actually watched. That or perhaps I'm missing a dependency.

Also ionic cordova run android -l -c --verbose - it appears because the serve command doesn't add plugins it brings up an error.

$ ionic cordova run android -l -c --verbose
[DEBUG] Load global plugin @ionic/cli-plugin-proxy
[DEBUG] Load local plugin @ionic/cli-plugin-cordova from **/node_modules/@ionic/cli-plugin-cordova
[DEBUG] Load local plugin @ionic/cli-plugin-ionic-angular from **/node_modules/@ionic/cli-plugin-ionic-angular
Starting app-scripts server: --livereload --l --consolelogs --c --address 0.0.0.0 --port 8100 --p 8100 --livereload-port 35729 --r 35729 --iscordovaserve --externalIpRequired --nobrowser - Ctrl+C to cancel
[08:57:32]  watch started ... 
[08:57:32]  build dev started ... 
[08:57:32]  clean started ... 
[08:57:32]  clean finished in 3 ms 
[08:57:32]  copy started ... 
[08:57:32]  transpile started ... 
[08:57:36]  transpile finished in 3.36 s 
[08:57:36]  preprocess started ... 
[08:57:36]  deeplinks started ... 
[08:57:36]  deeplinks finished in 95 ms 
[08:57:36]  preprocess finished in 97 ms 
[08:57:36]  webpack started ... 
[08:57:45]  copy finished in 12.09 s 
[08:57:45]  webpack finished in 8.64 s 
[08:57:45]  sass started ... 
[08:57:46]  sass finished in 1.10 s 
[08:57:46]  postprocess started ... 
[08:57:46]  postprocess finished in 10 ms 
[08:57:46]  lint started ... 
[08:57:46]  build dev finished in 13.41 s 
[08:57:46]  watch ready in 13.67 s 
[08:57:46]  dev server running: http://localhost:8100/ 

> cordova run android
[08:57:48]  lint finished in 2.72 s 
ANDROID_HOME=/Users/SilverbackIS/android/android-sdk-macosx
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_25.jdk/Contents/Home
Subproject Path: CordovaLib
Starting a Gradle Daemon (subsequent builds will be faster)

null

The Task.leftShift(Closure) method has been deprecated and is scheduled to be removed in Gradle 5.0. Please use Task.doLast(Action) instead.

    at build_296dok7khnhpdvwve0rju9onz.run(**/platforms/android/build.gradle:139)
org.xwalk:xwalk_core_library:21+
The JavaCompile.setDependencyCacheDir() method has been deprecated and is scheduled to be removed in Gradle 4.0.

Incremental java compilation is an incubating feature.
The TaskInputs.source(Object) method has been deprecated and is scheduled to be removed in Gradle 4.0. Please use TaskInputs.file(Object).skipWhenEmpty() instead.

:preBuild
 UP-TO-DATE
:preArmv7DebugBuild
 UP-TO-DATE
:checkArmv7DebugManifest

:preArmv7ReleaseBuild 
UP-TO-DATE
:preX86DebugBuild
 UP-TO-DATE

:preX86ReleaseBuild
 UP-TO-DATE

:CordovaLib:preBuild UP-TO-DATE
:CordovaLib:preDebugBuild
 UP-TO-DATE
:CordovaLib:checkDebugManifest

:CordovaLib:prepareDebugDependencies

:CordovaLib:compileDebugAidl

UP-TO-DATE
:CordovaLib:compileDebugNdk

UP-TO-DATE
:CordovaLib:compileLint

UP-TO-DATE
:CordovaLib:copyDebugLint

UP-TO-DATE
:CordovaLib:mergeDebugShaders

UP-TO-DATE
:CordovaLib:compileDebugShaders
 UP-TO-DATE

:CordovaLib:generateDebugAssets UP-TO-DATE
:CordovaLib:mergeDebugAssets
 UP-TO-DATE

:CordovaLib:mergeDebugProguardFiles

UP-TO-DATE
:CordovaLib:packageDebugRenderscript

UP-TO-DATE
:CordovaLib:compileDebugRenderscript

UP-TO-DATE
:CordovaLib:generateDebugResValues

UP-TO-DATE
:CordovaLib:generateDebugResources UP-TO-DATE

:CordovaLib:packageDebugResources

UP-TO-DATE
:CordovaLib:processDebugManifest

UP-TO-DATE
:CordovaLib:generateDebugBuildConfig

UP-TO-DATE
:CordovaLib:processDebugResources

UP-TO-DATE
:CordovaLib:generateDebugSources

UP-TO-DATE
:CordovaLib:incrementalDebugJavaCompilationSafeguard

UP-TO-DATE
:CordovaLib:compileDebugJavaWithJavac

UP-TO-DATE
:CordovaLib:processDebugJavaRes

UP-TO-DATE
:CordovaLib:transformResourcesWithMergeJavaResForDebug

UP-TO-DATE
:CordovaLib:transformClassesAndResourcesWithSyncLibJarsForDebug

UP-TO-DATE
:CordovaLib:mergeDebugJniLibFolders
 UP-TO-DATE

:CordovaLib:transformNative_libsWithMergeJniLibsForDebug

UP-TO-DATE
:CordovaLib:transformNative_libsWithSyncJniLibsForDebug

UP-TO-DATE
:CordovaLib:bundleDebug

UP-TO-DATE
:CordovaLib:preReleaseBuild
 UP-TO-DATE
:CordovaLib:checkReleaseManifest

:CordovaLib:prepareReleaseDependencies

:CordovaLib:compileReleaseAidl

UP-TO-DATE
:CordovaLib:compileReleaseNdk

UP-TO-DATE
:CordovaLib:copyReleaseLint

UP-TO-DATE
:CordovaLib:mergeReleaseShaders

UP-TO-DATE
:CordovaLib:compileReleaseShaders

UP-TO-DATE
:CordovaLib:generateReleaseAssets

UP-TO-DATE
:CordovaLib:mergeReleaseAssets

UP-TO-DATE
:CordovaLib:mergeReleaseProguardFiles

UP-TO-DATE
:CordovaLib:packageReleaseRenderscript

UP-TO-DATE
:CordovaLib:compileReleaseRenderscript

UP-TO-DATE
:CordovaLib:generateReleaseResValues

UP-TO-DATE
:CordovaLib:generateReleaseResources 
UP-TO-DATE
:CordovaLib:packageReleaseResources

UP-TO-DATE
:CordovaLib:processReleaseManifest

UP-TO-DATE
:CordovaLib:generateReleaseBuildConfig

UP-TO-DATE
:CordovaLib:processReleaseResources

UP-TO-DATE
:CordovaLib:generateReleaseSources

UP-TO-DATE
:CordovaLib:incrementalReleaseJavaCompilationSafeguard
 UP-TO-DATE

:CordovaLib:compileReleaseJavaWithJavac
 UP-TO-DATE

:CordovaLib:processReleaseJavaRes

UP-TO-DATE
:CordovaLib:transformResourcesWithMergeJavaResForRelease

UP-TO-DATE
:CordovaLib:transformClassesAndResourcesWithSyncLibJarsForRelease

UP-TO-DATE
:CordovaLib:mergeReleaseJniLibFolders

UP-TO-DATE
:CordovaLib:transformNative_libsWithMergeJniLibsForRelease

UP-TO-DATE
:CordovaLib:transformNative_libsWithSyncJniLibsForRelease
 UP-TO-DATE

:CordovaLib:bundleRelease
 UP-TO-DATE

:prepareComAndroidSupportAnimatedVectorDrawable2510Library

UP-TO-DATE
:prepareComAndroidSupportAppcompatV72510Library
 UP-TO-DATE

:prepareComAndroidSupportSupportCompat2510Library
 UP-TO-DATE

:prepareComAndroidSupportSupportCoreUi2510Library

UP-TO-DATE
:prepareComAndroidSupportSupportCoreUtils2510Library
 UP-TO-DATE

:prepareComAndroidSupportSupportFragment2510Library

UP-TO-DATE
:prepareComAndroidSupportSupportMediaCompat2510Library

UP-TO-DATE
:prepareComAndroidSupportSupportV42510Library

UP-TO-DATE
:prepareComAndroidSupportSupportVectorDrawable2510Library

UP-TO-DATE
:prepareComNoisepagesNettoyeurMidi100Rc1Library
 UP-TO-DATE

:prepareOrgApacheCordovaCordovaLib623DebugLibrary

UP-TO-DATE
:prepareOrgPuredataAndroidPdCore101Library
 UP-TO-DATE

:prepareOrgXwalkXwalk_core_library21515467Library

UP-TO-DATE
:prepareArmv7DebugDependencies

:compileArmv7DebugAidl
 UP-TO-DATE

:compileArmv7DebugRenderscript

UP-TO-DATE
:generateArmv7DebugBuildConfig
 UP-TO-DATE

:mergeArmv7DebugShaders
 UP-TO-DATE

:compileArmv7DebugShaders
 UP-TO-DATE

:generateArmv7DebugAssets UP-TO-DATE
:mergeArmv7DebugAssets
 UP-TO-DATE

:createXwalkCommandLineFileArmv7Debug

:generateArmv7DebugResValues

UP-TO-DATE
:generateArmv7DebugResources

UP-TO-DATE
:mergeArmv7DebugResources

:processArmv7DebugManifest
 UP-TO-DATE

:processArmv7DebugResources

:generateArmv7DebugSources

:incrementalArmv7DebugJavaCompilationSafeguard
 UP-TO-DATE

:compileArmv7DebugJavaWithJavac
 UP-TO-DATE

:compileArmv7DebugNdk

UP-TO-DATE
:compileArmv7DebugSources

UP-TO-DATE
:transformClassesWithDexForArmv7Debug

UP-TO-DATE
:mergeArmv7DebugJniLibFolders

UP-TO-DATE
:transformNative_libsWithMergeJniLibsForArmv7Debug
 UP-TO-DATE
:processArmv7DebugJavaRes
 UP-TO-DATE

:transformResourcesWithMergeJavaResForArmv7Debug

UP-TO-DATE
:validateSigningArmv7Debug

:packageArmv7Debug

:assembleArmv7Debug
:checkX86DebugManifest

:prepareX86DebugDependencies

:compileX86DebugAidl
 UP-TO-DATE

:compileX86DebugRenderscript

UP-TO-DATE
:generateX86DebugBuildConfig
 UP-TO-DATE
:mergeX86DebugShaders

UP-TO-DATE
:compileX86DebugShaders

UP-TO-DATE
:generateX86DebugAssets

UP-TO-DATE
:mergeX86DebugAssets

UP-TO-DATE
:createXwalkCommandLineFileX86Debug

:generateX86DebugResValues

UP-TO-DATE
:generateX86DebugResources

UP-TO-DATE
:mergeX86DebugResources

:processX86DebugManifest
 UP-TO-DATE

:processX86DebugResources

:generateX86DebugSources

:incrementalX86DebugJavaCompilationSafeguard
 UP-TO-DATE
:compileX86DebugJavaWithJavac
 UP-TO-DATE

:compileX86DebugNdk
 UP-TO-DATE
:compileX86DebugSources UP-TO-DATE
:transformClassesWithDexForX86Debug

UP-TO-DATE
:mergeX86DebugJniLibFolders

UP-TO-DATE
:transformNative_libsWithMergeJniLibsForX86Debug

UP-TO-DATE
:processX86DebugJavaRes
 UP-TO-DATE
:transformResourcesWithMergeJavaResForX86Debug

UP-TO-DATE
:validateSigningX86Debug

:packageX86Debug

:assembleX86Debug
:assembleDebug

:cdvBuildDebug

BUILD SUCCESSFUL

Total time: 26.851 secs

Built the following apk(s): 
    **/platforms/android/build/outputs/apk/android-armv7-debug.apk
    **/platforms/android/build/outputs/apk/android-x86-debug.apk

ANDROID_HOME=/Users/SilverbackIS/android/android-sdk-macosx
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_25.jdk/Contents/Home
No target specified, deploying to device 'ce021712d45794260c'.

Skipping build...
Built the following apk(s): 
    **/platforms/android/build/outputs/apk/android-armv7-debug.apk

Using apk: **/platforms/android/build/outputs/apk/android-armv7-debug.apk

Package name: com.silverbackis.comonitor
LAUNCH SUCCESS
adewoleadenigbagbe commented 7 years ago

Having the same issue.After launch success ,the command line revert back,here is eeee the ouput am getting.

miguelonga commented 7 years ago

Same issue here. I do:

adewoleadenigbagbe commented 7 years ago

Miguelonga .I got that using Cordova run Android

manticarodrigo commented 7 years ago

Ionic serve stopped working for me yesterday. I'm not sure if it stopped working when I updated the cli but I did notice the added ionic cordova run yesterday.

The issue is that when I run ionic serve it loads the same build from two days ago regardless of changes I make or builds that I run. I can build changes to ios and browser using the new ionic cordova run but my development environment is screwed up without ionic serve and I can't test changse without deploying to my live webapp or phone. Any thoughts?

EDIT: I had uncommented the service worker script in my index.html briefly so my browser had registered to it and the cache was still there. Problem solved :D

silverbackdan commented 7 years ago

@dwieeb Is there anything else I can provide or do to help you with this issue?

imhoffd commented 7 years ago

Is this not the service worker issue @manticarodrigo described? That's been the solution for a few people now.

silverbackdan commented 7 years ago

Unfortunately not, this is my index.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
  <script data-ionic="inject">
    (function(w){var i=w.Ionic=w.Ionic||{};i.version='3.2.1';i.angular='4.1.0';i.staticDir='build/';})(window);
  </script>
  <meta charset="UTF-8">
  <title>App</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta name="format-detection" content="telephone=no">
  <meta name="msapplication-tap-highlight" content="no">

  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
  <link rel="manifest" href="manifest.json">
  <meta name="theme-color" content="#4e8ef7">

  <!-- cordova.js required for cordova apps -->
  <script src="cordova.js"></script>

  <!-- un-comment this code to enable service worker
  <script>
    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.register('service-worker.js')
        .then(() => console.log('service worker installed'))
        .catch(err => console.log('Error', err));
    }
  </script> -->

  <link href="build/main.css" rel="stylesheet">

</head>
<body>

  <!-- Ionic's root component and where the app will load -->
  <ion-app></ion-app>

  <!-- The polyfills js is generated during the build process -->
  <script src="build/polyfills.js"></script>

  <!-- The bundle js is generated during the build process -->
  <script src="build/main.js"></script>

</body>
</html>

I'm also on the latest version of Ionic so when I run serve, the service script is automatically commented out.

I did just have a website where webpack caused issues on though, it wouldn't compile scss to css (or it would, the final file just wouldn't appear) but it'd be OK with JS and copying assets, but struggled with watching as well, even though node-sass would watch without an issue. So I imagine this will be more related to Webpack now I've spotted that is what's being used in the output.

silverbackdan commented 7 years ago

It appears my issue lies mainly with webpack so I've raised an issue there. A webpack installation on a web-based Laravel project is not watching files or creating the final css files. Thanks for coming back to me though @dwieeb

silverbackdan commented 7 years ago

Ah ha! In one of my parent folders I had used brackets. Webpack watch command was therefore not working. I've raised an issue there https://github.com/webpack/webpack/issues/5018 - I think this issue is OK to close :)

silverbackdan commented 7 years ago

Can I add one last thing, the CLI update most recently appears to comment out the service worker script again. However it also seems to remove meta tags (content-security-policy) - should I add as a new issue?

imhoffd commented 7 years ago

@silverbackdan Glad you got it. For build issues, generally the best place to create an issue is in the app-scripts repo: https://github.com/ionic-team/ionic-app-scripts

iknox27 commented 6 years ago

i have the same issue with ionic 3.4.0 but i dont have the ionic watch ready ... see

ionic-app-scripts serve "--v2" "undefined" "--address" "0.0.0.0" "--port" "8100" "--livereload-port" "35729"

[17:35:41] ionic-app-scripts 2.1.4 [17:35:41] watch started ... [17:35:41] build dev started ... [17:35:41] clean started ... [17:35:41] clean finished in 7 ms [17:35:41] copy started ... [17:35:41] transpile started ... [17:35:44] transpile finished in 3.40 s [17:35:44] preprocess started ... [17:35:44] deeplinks started ... [17:35:44] deeplinks finished in 193 ms [17:35:44] preprocess finished in 194 ms [17:35:44] webpack started ... [17:35:44] copy finished in 3.81 s [17:35:54] webpack finished in 10.24 s [17:35:54] sass started ... [17:35:58] sass finished in 3.22 s [17:35:58] postprocess started ... [17:35:58] postprocess finished in 15 ms [17:35:58] lint started ... [17:35:58] build dev finished in 17.14 s [17:35:58] dev server running: http://localhost:8100/

airstep commented 6 years ago

So, I solved it in such way:

cp node_modules/@ionic/app-scripts/configs/watch.config.js {{root_project}}/scripts

Edit:

var watch = require('../node_modules/@ionic/app-scripts/dist/watch');
module.exports = {
  srcFiles: {
    paths: ['{{SRC}}/**/*.(ts|html|s(c|a)ss)'],
    options: { ignored: ['{{SRC}}/**/*.spec.ts', '{{SRC}}/**/*.e2e.ts', '**/*.DS_Store', '{{SRC}}/index.html'] },
    callback: watch.buildUpdate
  }
};

Then, add such line to package.json:

"config": { "ionic_watch": "./scripts/watch.config.js" },

And try it, works for me (tested few minutes now - but it doesn't work about half day ;)

airstep commented 6 years ago

Not works anymore after few hours.... (

Lahrachtdi commented 6 years ago

@airstep Just tried, but it is not working hh I'm having the same issue, my Ionic version is 3.12.0 and I'm working on Ubuntu 16 it'is not just the browser that doesn't reload, but also the build don't happen when I change something in my code

Lahrachtdi commented 6 years ago

the version 2.1.4 of @ionic/app-scripts solved the problem for me

airstep commented 6 years ago

@Lahrachtdi - so, I have already this version - but it's not work with livereload

Lahrachtdi commented 6 years ago

@airstep I don't know what's happen, it is not working anymore

sbonder101 commented 6 years ago

I had this problem for 3 days now. I solved it by making sure that the path to the app doesn't contain spaces.

airstep commented 6 years ago

@sbonder101 My path is without any spaces - no luck

sbonder101 commented 6 years ago

@airstep I just created a new project, and I copied the 'src' folder from the old directory, and the package.js file. And installed all the necessary plugins and it worked

airstep commented 6 years ago

@sbonder101 but it some times work sometimes not... random

matteobattista commented 6 years ago

@sbonder101 what do you mean for "the path to the app doesn't contain spaces." Thank you

I already have this problem... not solved!

My ionic info:

$ ionic info

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

    @ionic/cli-utils  : 1.13.0
    ionic (Ionic CLI) : 3.13.0

global packages:

    cordova (Cordova CLI) : 7.1.0 

local packages:

    @ionic/app-scripts : 3.0.0-201710101530
    Cordova Platforms  : android 6.3.0
    Ionic Framework    : ionic-angular 3.7.1

System:

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

Misc:

    backend : legacy
airstep commented 6 years ago

I think this node is closed - so we must go there: https://github.com/ionic-team/ionic-cli/issues/2719

airstep commented 6 years ago

Just learned about Stencil and when using demo found that I have error from node.js ENOSPC (not enough space on the drive but I have more than need)

After that I just looked at different issues and found this one:

On Linux (or Mac) we have a max number of system watchers we can place at an IO level (from my understanding). So for large projects, it seems that Jest is trying to watch just way to many files.

To fix:

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

And after that livereload again works for project that before has no reaction.

james11a commented 6 years ago

Thanks @airstep. Setting max_user_watches to a higher value fixed the livereload problem for me too.

franklintiel commented 6 years ago

Thanks @airstep, the fix is works for me!

Tulika12 commented 6 years ago

Starting app-scripts server: --address 0.0.0.0 --port 8100 --livereload-port 35729 --dev-logger-port 53703 --nobrowser - Ctrl+C to cancel [15:52:57] watch started ... [15:52:57] build dev started ... [15:52:57] clean started ... [15:52:57] clean finished in less than 1 ms [15:52:57] copy started ... [15:52:57] deeplinks started ... [15:52:57] deeplinks finished in 16 ms [15:52:57] transpile started ... [15:53:01] transpile finished in 3.63 s [15:53:01] preprocess started ... [15:53:01] preprocess finished in less than 1 ms [15:53:01] webpack started ... [15:53:01] copy finished in 3.85 s [15:53:07] webpack finished in 6.08 s [15:53:07] sass started ... [15:53:08] sass finished in 936 ms [15:53:08] postprocess started ... [15:53:08] postprocess finished in less than 1 ms [15:53:08] lint started ... [15:53:08] build dev finished in 10.86 s [15:53:08] watch ready in 10.94 s [15:53:08] dev server running: http://localhost:8100/

[OK] Development server running! Local: http://localhost:8100 External: http://192.168.1.7:8100 DevApp: tesing@8100 on Lwisl-PC

C:\Users\Lwisl\projects\tesing> i have also same issue after ionic serve ...application is not running on browser its automatically canceled???? any comment?

anesask commented 6 years ago

@Tulika12 I had same issue and changing "live-reload port" solved my problem. Try this in your command line, hope it will works for you. ionic serve -r 33222

Tulika12 commented 6 years ago

Thanx...@anesask

Khazi-Nawaz-Ahamed commented 6 years ago

Thanks @airstep, the fix is works for me!

raykin commented 6 years ago

@anesask change port doesn't work in my case. Even don't know how to debug it.

anesask commented 6 years ago

@raykin Did you check @airstep's fix?

gdcruz9 commented 6 years ago

i ran this:

npm i -D -E ws@3.3.2

and now seems to work again.

henryemekaonuorah92 commented 6 years ago

@airstep echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

this solution does not work on my mac os 10.13.4 it returns the error below

sysctl: illegal option -- p usage: sysctl [-bdehiNnoqx] name[=value] ... sysctl [-bdehNnoqx] -a sysctl: illegal option -- p usage: sysctl [-bdehiNnoqx] name[=value] ... sysctl [-bdehNnoqx] -a

franzisk commented 5 years ago

i ran this:

npm i -D -E ws@3.3.2

and now seems to work again.

What is this?