CODEWITHSUNDEEP
ionic-frameworkgulp
Jayr Motta
Jayr Motta

Reputation: 718

Ionic serve ignoring gulpStartupTasks

I have this ionic.project file:

{
  "name": "foobar",
  "app_id": "com.foo.bar",
  "gulpStartupTasks": [
    "styles",
    "source",
    "watch"
  ],
  "watchPatterns": [
    "www/**/*",
    "!www/lib/**/*"
  ],
  "sourceModules": {
    "ionic": "git://github.com/driftyco/ionic.git",
    "ng-cordova": "git://github.com/driftyco/ng-cordova.git"
  }
}

But the gulp tasks are not being executed, I even added some console.logs to debug but nothing happened.

Any ideas?

UPDATE:

I've detected that the gulpStartupTasks are being executed asynchronously with the Ionic initialization, so when Ionic tries to find the www folder and don't find it (because my startup tasks haven't run yet) it fails and kill the process

But if I create an empty www folder to trick Ionic it works but opens a browser with an error saying that the index.html haven't been found

However, some seconds after that I see the startup tasks being executed in my shell

And if I refresh the page it works

How can I make these startup tasks run before ionic tries to find the www folder?

Upvotes: 5

Views: 1442

Answers (3)

Sam
Sam

Reputation: 2658

According to the latest Ionic-Cli documentation, if you want any gulp tasks to run before the app is served, add a serve:before task to the gulpfile.js file in your project root. In your case this would be:

gulp.task("serve:before", [
    "styles",
    "source",
    "watch"
]);

Upvotes: 4

Stone
Stone

Reputation: 2668

So I figured this out. I'm guessing that you, like myself, are editing in a different .sass or .scss file than the one that comes with ionic skeleton apps. In this case you need to add this new path to the gulp file or livereload will pick up the changes, but not actually perform the 'sass' command on the path with your new SASS file(s).

Here's my edited paths line in gulpfile.js

var paths = {
  sass: ['./scss/**/*.scss', './www/sass/**/*']
};

'./www/sass/**/*' is where I put my new SASS files that I @import in the main ionic.app.scss file.

// Include all of Ionic
@import "www/lib/ionic/scss/ionic";
@import "www/sass/test";

Upvotes: 0

Jayr Motta
Jayr Motta

Reputation: 718

I figured that Ionic wasn't ignoring gulpStartupTasks as I've previously updated the question, but rather executing them asynchronously to the server initialization.

To fix that I've added a postinstall script in my package.json to do the job of creating the www folder, processing the source files and then copying them to the www folder.

That solved the problem, but I still don't understand why gulpStartupTasks execute async instead of sync, it seems to be wrong. Don't you?

Upvotes: 0

Related Questions