generator-ionic icon indicating copy to clipboard operation
generator-ionic copied to clipboard

grunt serve takes too long to build app

Open ghost opened this issue 10 years ago • 9 comments

First of all: GREAT JOB, guys. generator-ionic is a such a great generator!!

I've successfully installed yo ionic. I did grunt serve and made some changes in html files in app/ folder. The grunt tasks start working and builds the app. But here comes the issue:

Buliding takes sooo long (more than 60s).

Surprisingly, if I do changes in www/ folder directly the livereload task does its job in about 10s. Is that expected behaviour? Or what am I doing wrong?

Here is the console output:

Loading: /?restart=501162
>> File "app/templates/tab-dash.html" changed.
Running "newer:copy:app" (newer) task

Running "copy:app" (copy) task
Copied 1 file

Running "newer-postrun:copy:app:1:/vagrant/poppe-kappus-ionic/node_modules/grunt-newer/.cache" (newer-postrun) task

Done, without errors.


Execution Time (2015-02-17 21:53:39 UTC)
loading tasks    90ms  ▇ 1%
newer:copy:app     8s  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 96%
copy:app        141ms  ▇ 2%
Total 8.3s

Completed in 93.949s at Tue Feb 17 2015 21:53:47 GMT+0000 (UTC) - Waiting...
HTML changed: www/templates/tab-dash.html

ghost avatar Feb 17 '15 21:02 ghost

What is your pc configuration ?

HottonJoris avatar Feb 18 '15 16:02 HottonJoris

Vagrant with 4 gig ram in Virtualbox, running on Ubuntu 12.04

georgschlenkhoff avatar Feb 18 '15 18:02 georgschlenkhoff

Gijobs: As said if I do changes in www/ directory directly, restart happens in about 10s. Typically I don't need any Sass building or staff like this as I'm workin' on controllers, services, html-pages, etc.

Can't there be a grunt serve:develop task that just copies app to www folder and that's it. Or is that already the intended behaviour? I don't understand where the 93s in time come from?

georgschlenkhoff avatar Feb 19 '15 09:02 georgschlenkhoff

The reason it is so fast when you make changes in the www folder is the Ionic CLI. This generator has the CLI integrated directly. So after the Generator builds the WWW directory, it is using Ionic's CLI to watch the WWW directory, and Grunt is watching the app directory. So Grunt will detect your changes in /app, and when you save them grunt will load them into /www, and Ionic cli detects the changes in /www, and reloads the browser serve with the updated files.

So when you only make changes to the WWW, you are in effect doing regular Ionic development. If you start doing this, you are going to start losing your changes, because the next time you run grunt serve, your changes in WWW are going to get wiped out.

The intended behavoir of grunt serve is that when you save a unique file, grunt will reload that unique file into the www (uncompressed). If you want a compressed www, you need to run grunt compress first.

And the issue you are having with time. I think there is something wrong with your environment. After running grunt serve for the first time, any times after that it runs for me in under 5 seconds.

olivercodes avatar Mar 03 '15 23:03 olivercodes

I'm experiencing this as well on much heftier system specs. From CTRL-S to browser reload is about 10 seconds, it appears as though the watcher is passing all files regardless of modified time. (Windows 8.1)

rovangju avatar Mar 17 '15 02:03 rovangju

I'm seeing the same behavior. It first recognizes that one file changed, but then seems to say everything changed. Maybe the first is grunt saying the app file changed, and the others is ionic saying the www files changed (since grunt copied them over). A more incremental copy here would be extremely useful and much faster I think.

bluesliverx avatar Mar 19 '15 03:03 bluesliverx

Seeing the same problem with Windows 10. The task is configured to only copy newer files.

    watch: {
      bower: {
        files: ['bower.json'],
        tasks: ['wiredep', 'newer:copy:app']
      },
      html: {
        files: ['<%= yeoman.app %>/**/*.html'],
        tasks: ['newer:copy:app']
      },
      images: {
        files: ['<%= yeoman.app %>/**/*.{png,jpg,jpeg,gif,webp,svg}'],
        tasks: ['newer:copy:app']
      },
      js: {
        files: ['<%= yeoman.app %>/**/*.js'],
        tasks: ['newer:copy:app', 'newer:jshint:all']
      },
      compass: {
        files: ['<%= yeoman.app %>/<%= yeoman.styles %>/**/*.{scss,sass}'],
        tasks: ['compass:server', 'autoprefixer', 'newer:copy:tmp']
      },
      gruntfile: {
        files: ['Gruntfile.js'],
        tasks: ['ngconstant:development', 'newer:copy:app']
      }
    },

jskrepnek avatar Aug 27 '15 21:08 jskrepnek

Having exactly the same problem (Win7). It takes ~60 seconds to reload the page after making some changes in the /app folder.

Running "copy:app" (copy) task

JS changed: C:\...\www\bower_components\angular-animate\angular-animate.js File changed: C:\...\www\bower_components\angular-animate\README.md File changed: C:\...\www\README.md JS changed: C:\...\www\bower_components\angular-mocks\ngMockE2E.js JS changed: C:\...\www\bower_components\angular-mocks\ngAnimateMock.js

It seems like it copies all (unchanged) bower_components again into the www folder

iischwuerfl avatar Apr 12 '16 06:04 iischwuerfl

Exact same problem, (Win10 tablet) It took too long to reload. Running "newer:copy:app" (newer) task was always immediately followed by Running "copy:app" (copy) task. All bower_components files were copied every time newer:copy:app was run.

I gave up fixing this problem and found a workaround. Switched from grunt-contrib-copy to grunt-sync, works like magic. I haven't checked how this affects minify or other build tasks yet.

seon-geun avatar Nov 10 '16 07:11 seon-geun