Top Gulp Js frequently asked interview questions

In this post we will look at Gulp Js Interview questions. Examples are provided with explanation.

1. What is Gulp Js?
2. What are the APIs used in Gulp Js?
3. Is gulp based on node.js?
4. What is code over configuration?
5. How do we install Plugins in Gulp Js?
6. What are the HTML & CSS Plugins in Gulp?
7. How can Gulp run tasks sequentially?
8. What are Unit Tests Plugins?
9. How can a node update a specific package?
10. How can we uglify output with Browserify in Gulp?

What is Gulp Js?

Gulp Js is used in building JavaScript Task Runner and the toolkit for automating and enhancing complex tasks such as checking, js errors, magnification, compiling SASS, optimizing images, unit testing and CSS files.It is an automation, platform-agnostic and has strong ecosystem.Gulp Js is used in solving problems of code repetitions and is easy to use, is efficient and also has a simple API.

What are the APIs used in Gulp Js?

There are 4 types of APIs used in Gulp Js:
gulp.task() used in defining a Task
gulp.src() used in reading Files
gulp.dest() used in writing Files
gulp.watch() used in watching Files for any changes

Is gulp based on node.js?

YES, Gulp is based on node.js.

What is code over configuration?

Gulp uses code over configuration that helps in keeping things simple and making complex tasks manageable.
Here is an syntax of a grunt file used by gulp:

module.exports = function(grnt) {
  grnt.initConfig({
    pkg: grnt.file.readJSON('package.json'),
    ConCat: {
      options: {
        separator: ';'
      },
      dist: {
        src: ['src/**/*.js'],
        dest: 'dist/<%= pkg.name %>.js'
      }
    }
     
 });
  grnt.loadNpmTasks('grnt-contrib-ConCat');
  grnt.registerTask('default', ['ConCat']);

How do we install Plugins in Gulp Js?

Plugins are also called minify-css for merging and minifying all the css scripts.It can aslo be installed by using the npm given below:

npm install gulp-minify-css --save--dev-gulp

What are the HTML & CSS Plugins in Gulp?

How can Gulp run tasks sequentially?

Gulpuns tasks by using snippet like this:

gulp.task "tea", ->
    gulp.src("src/server/**/*.tea")
        .pipe(tea {bare: true}).on("error",gutil.log)
        .pipe(gulp.dest "bin")

gulp.task "clean",->
    gulp.src("bin", {read:false})
        .pipe clean
            force:true

gulp.task 'develop',['clean','tea'], ->
    console.log "run something else"

What are Unit Tests Plugins?

How can a node update a specific package?

A node can update packages by using npm update or a module:

npm update browser-sync
pnpm update browser-sync
yarn upgrade browser-sync

How can we uglify output with Browserify in Gulp?

We can uglify an output by converting the streaming vinly file object:

var browserify = require('browserify');
var gulp = require('gulp');
var uglify = require('gulp-uglify');
var source = require('vinyl-source-stream');
var buffer = require('vinyl-buffer');

gulp.task('browserify', function() {
  return browserify('./source/scripts/app.js')
    .bundle()
    .pipe(source('bundle.js')) // giveing streams vinyl file object
    .pipe(buffer()) // <----- converting from streaming to buffered vinyl file object
    .pipe(uglify()) // now gulp-uglify works
    .pipe(gulp.dest('./build/scripts'));
});

See Also
Spring Batch Interview Questions
Apache Camel Interview Questions
JBoss Fuse Interview Questions
Drools Interview Questions
Java 8 Interview Questions