Gulp or Webpack on Ionic 2?


#1

Does Ionic 2 use gulp or webpack to bundle assets?

I can’t understand what’s happening in a project Iḿ working in. It was working ok with these settings:

Cordova CLI: 6.0.0
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Version: 2.0.0-beta.3
Ionic CLI Version: 2.0.0-beta.19
Ionic App Lib Version: 2.0.0-beta.9

when I do ionic serve, the assets are built properly by webpack.

Then I started to work on it in another environment (I commited the project to a git repository, then in thje other machine installed the Ionic 2 and dependencies). When I run ionic serve, the assets are not “compiled” Example: app.bundle.js is not created).
Cordova CLI is 6.1.0, Ionic CLI Version is 2.0.0-beta.23 and Ionic App Lib Version is 2.0.0-beta.13.

The weird thing is that if I follow this tutorial http://ionicframework.com/docs/v2/getting-started/tutorial/ a new project works fine, but I noticed that the assets are bundled using gulp.

Am I missing something?


#2

So this is part of some changes we’ve talked about before.

We’re moving over to using gulp as the core task runner, and letting users choose how the bundle/compile the code to es5.


#3

Oh, thanks!
I’ll update the first environment to the latest version. Is there any doc about how to migrate from webpack to gulp?
Or the best way is to create a new project (based on gulp) and follow it steps?


#4

You’re probably better off creating a new project and moving code over. While it’s a bit of a pain (we know, we’re sorry!) it will makes sure that everything is setup correctly.

As all of this stuff gets finalized, this shouldn’t be an issue anymore :slight_smile:


#5

I created a new project with new CLI and App Lib version, moved the code and everything now is ok.
Thanks for the help.


#6

Hey, @mhartington, I have a small thing to say about Gulp:

When I used Gulp in Ionic1 it worked really well. I just had to add gulp-plumber to every single gulpfile.js.

gulp-plumber prevents gulp from crashing and stop running when an error occurs. Like when you forget to type a color in a .scss file, the gulp process doesn’t stop.

What do you think about adding it to the default gulpfile.js?


#7

@EuAndreh so in this case, gulp-plumber is not needed.

So here, gulp-sass actually has a method to handle errors, and not crash :smile:


#8

@mhartington hmm, nice tip! :slight_smile:


#9

Please make an official announcement somewhere when things are finalized with what’s changed.