Search code examples
angularwebpackgulpgruntjsmean-stack

Why use Gulp in Angular


I'm applying for a job and I've been asked to develop a small web app using MEAN Stack with Angular 2+. Everything ok for the exception that I've been asked to use Gulp/Grunt also.

I did some digging and I found out that they are task runners and they were mostly used in AngularJS among other JS technologies, but I haven't found much information on Angular 2+.

So, my question is why should I use it in a MEAN stack web app and why using it will make my web app better? Doesn't Webpack do something similar already?


Solution

  • Gulp was created to be a task runner.

    Gulp is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.

    As a task runner, it can do anything, from optimization to copying files.

    Webpack on the other hand, is a bundler.

    webpack is a static module bundler for modern JavaScript applications. When webpack processes your application, it internally builds a dependency graph which maps every module your project needs and generates one or more bundles.

    It process all your files, it compiles ESX to a more compatible version, compiles sass to css... it does basically almost the same as gulp, but on the other hand it can apply lots of optimizations that gulp is not capable of. And also, it packs your files into modules that are available to be used to the browser.

    TL;TR: both acts like the same, the oly difference is that webpack applies/can apply much more optimizations to your code that gulp cannot.