Ionic CLI doesn't run gulp tasks on ionic serve


#1

Hi all,

I recently updated ionic cli to be able to run an ionic2 side project to learn. However, my main project is still in ionic1. Now, when I run ionic serve, gulp tasks are not executed.

System information:

Cordova CLI: 6.1.1
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.0
Ionic Framework Version: 1.2.4-nightly-1917
Ionic CLI Version: 2.0.0-beta.24
Ionic App Lib Version: 2.0.0-beta.14
ios-deploy version: 1.8.4
ios-sim version: 5.0.6
OS: Mac OS X El Capitan
Node Version: v0.12.4
Xcode version: Xcode 7.3 Build version 7D175

And when I run ionic serve:

ionic serve
WARN: ionic.project has been renamed to ionic.config.json, please rename it.
WARN: ionic.project has been renamed to ionic.config.json, please rename it.
Running live reload server: http://localhost:35729
Watching: www//*, !www/lib//*
√ Running dev server: http://localhost:8100

My ionic.project file:

“gulpStartupTasks”: [
“sass”,
“templatecache”,
“watch”
],
“watchPatterns”: [
“www//*",
"!www/lib/
/*”
],
“browsers”: [
{
“platform”: “android”,
“browser”: “crosswalk”,
“version”: “12.41.296.5”
}
]
}

I hope you can help me to fix it


Unable to resolve "ionic cordova run android" errors
#2

I have the same problem.

You have a solution?


#3

As per the following, the 2.x.x will go directly into the gulpfile for tasks like watch and build.


(If you use Coffeescript gulpfile, there’s a further issue: https://github.com/driftyco/ionic-cli/issues/1004)


#4

I have come across the same problem!

ionic serve works and loads my app in the browser, but the SCSS files aren’t compiled unless I manually run gulp sass and live reload doesn’t work anymore for my Ionic 1 app

Did you find a solution?


#5

Same problem here … The gulp startup tasks aren’t automatically started anymore …


#6

Is there a solution to this yet?

Running gulp sass manually doesn’t seem to even work either


#7

Hi, I think i found a solution for the issue.

Just add this to your gulpfile.js

gulp.task('serve:before', ['default']);

That line tells the new ionic cli 2@beta to run the old ionic cli 1.x ‘default’ task before serving (before running ionic serve)

Also you need to add a ionic.config.json file with this:

{
  "name": "base_project",
  "app_id": "",
  "v2": false,
  "typescript": false,
  "watch": {
    "sass": ["scss/**/*.scss"],
    "html": ["www/**/*.html"],
    "livereload": [
      "www/**/*.html",
      "www/**/*.js",
      "www/**/*.css"
    ]
  }
}

Hope that helps


Run gulp task before ionic serve/build
Gulpfile not found: ./gulpfile.js
#8

I had the same issue, @agustinhaller solution solved it, now gulp task sass is running smoothly, Thanks!


#9

Oh. Thank you so much!

‘watch’ can be added to watch files also.

gulp.task('serve:before', ['default','watch']);


#10

In my case, the following resolves it: sudo ionic hooks add


#11

Check that you have the latest gulp-sass version in package.json; it’s a dependency of node-sass + required by Ionic, e.g.

"dependencies": {
    "gulp-sass": "^2.3.2"
  },

Uninstall gulp-sass

$ npm uninstall --save-dev gulp-sass

Reinstall gulp-sass

$ npm install --save-dev gulp-sass@2

There are a large number of issues pertaining to node-sass installation.
You may have to rebuild node-sass: $ npm rebuild node-sass


#12

I am having the same issue.

  1. ionic setup sass
  2. ionic serve
  3. dosnt work…

I have to run gulp sass watch then run ionic serve and it works…


#13

help:

$ ionic serve

There is an error in your gulpfile:
Error: /home/project/web/nodeJS/proyecto/app1/node_modules/node-sass/vendor/linux-x64-48/binding.node: failed to map segment from shared object: Operation not permitted
at Error (native)
at Object.Module._extensions…node (module.js:583:18)
at Module.load (module.js:473:32)
at tryModuleLoad (module.js:432:12)
at Function.Module._load (module.js:424:3)
at Module.require (module.js:483:17)
at require (internal/module.js:20:19)
at Object. (/home/project/web/nodeJS/proyecto/app1/node_modules/node-sass/lib/index.js:24:15)
at Module._compile (module.js:556:32)
at Object.Module._extensions…js (module.js:565:10)


#14

It worked for me :ok_hand:


#15

worked! Thank you so much!


#16

It works… but not entirely. It does not work if you want to have livereload. Can we add that as well?


#17

The solution discussed in this post should work with livereload also. (It’s working for me).

Can you please attach more information about the error you are getting?


#18

Couldn’t figure out why, but it wasn’t working for me until I removed the “scripts” tag from package.json


#19

Yeah, same thing here, that’s weird


#20

Same thing here. Had to remove “scripts” tag from package.json.