How to stop Gulp from watching for changes when used with maven build in AEM? | Community
Skip to main content
avinasht6348431
Level 2
Mar 1, 2019 12:37 PM UTC
Solved

How to stop Gulp from watching for changes when used with maven build in AEM?

Hi Team,

I am using gulp with frontend-maven-plugin. All my tasks defined in gulp are working fine. There is just one BIG issue. After gulp task executes the cmd waits in an infinite loop.
Below is the gulpfile.js:

var gulp = require('gulp');

var concat = require('gulp-concat');

var minifyCSS = require('gulp-minify-css');

var autoprefixer = require('gulp-autoprefixer');

var cleanCSS = require('gulp-clean-css');

var gulp = require('gulp'),

    uglify = require('gulp-uglify');

var pump = require('pump');

var paths = {

    scripts: "src/main/content/jcr_root/etc/designs/usity/clientlib-all/js/*.js",

    styles: "src/main/content/jcr_root/etc/designs/usity/clientlib-all/css/*.css"

}

gulp.task("merge-minify-js", function(){

      gulp.src(paths.scripts)

     .pipe(concat("all.js"))

     .pipe(uglify())

     .pipe(gulp.dest("src/main/content/jcr_root/etc/designs/usity/clientlib-all-min-js"));

     

});

gulp.task("merge-minify-css", function(){

      gulp.src(paths.styles)

     .pipe(concat("all.css"))

     .pipe(cleanCSS())

     .pipe(gulp.dest("src/main/content/jcr_root/etc/designs/usity/clientlib-all-min-css"));

});

// watch tasks for automation

gulp.task('watch', function() {

 

  gulp.watch(paths.scripts, ['merge-minify-js']);

  gulp.watch(paths.styles, ['merge-minify-css']);

});

gulp.task("default", ["watch","merge-minify-js", "merge-minify-css"]);

pom.xml i have added maven plugin:

<!--gulp-->

<plugin>

        <groupId>com.github.eirslett</groupId>

        <artifactId>frontend-maven-plugin</artifactId>

        <version>1.4</version>

             <!--<groupId>org.codehaus.mojo</groupId>

    <artifactId>exec-maven-plugin</artifactId>

    <version>1.5.0</version>  -->

        <executions>

           <execution>

                <id>install node and npm</id>

                <goals>

                    <goal>install-node-and-npm</goal>

                </goals>

                <configuration>

                    <nodeVersion>v10.15.1</nodeVersion>

                    <npmVersion>6.4.1</npmVersion>

                </configuration>

            </execution>

           <execution>

<id>npm run gulp</id>

<goals>

<goal>npm</goal>

</goals>

<configuration>

<arguments>run gulp</arguments>    

</configuration>

<phase>generate-resources</phase>

</execution>

            <execution>

                <id>bower install</id>

                <goals>

                     <goal>bower</goal>

                </goals>

                     <configuration>

                        <arguments>install</arguments>

                     </configuration>

                </execution>

                <execution>

                     <id>gulp build</id>

                     <goals>

                         <goal>gulp</goal>

                     </goals>

                     <phase>generate-resources</phase>

                </execution> 

        </executions>

    </plugin>

Kindly let me know the resolution for the same to make build successful.

Thanks in advance.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Gaurav-Behl
Gaurav-BehlAccepted solution
Level 10
Mar 1, 2019 2:39 PM UTC

change

gulp.task("default", ["watch","merge-minify-js", "merge-minify-css"]);

to

gulp.task("default", ["merge-minify-js", "merge-minify-css"]);

5 replies

avinasht6348431
Level 2
Mar 6, 2019 5:32 AM UTC

Thanks Gaurav!

Translate
Gaurav-Behl
Level 10
Mar 5, 2019 2:45 PM UTC

Not in the same thread/terminal/cmd but you can create another task like -   gulp.task("<mytask>", ["watch","merge-minify-js", "merge-minify-css"]);

and when you want to watch use "gulp <mytask>" in terminal otherwise for normal maven build when you wouldn't want build to keep waiting, use "default" (gulp would run "default"  task if you don't specify one in goal)

Translate
avinasht6348431
Level 2
Mar 5, 2019 4:38 AM UTC

Thanks Gaurav.It worked for me.

But is it possible to "watch" the tasks for js and css file(add/delete) and parallelly make the maven build also success?!

Translate
Gaurav-Behl
Gaurav-BehlAccepted solution
Level 10
Mar 1, 2019 2:39 PM UTC

change

gulp.task("default", ["watch","merge-minify-js", "merge-minify-css"]);

to

gulp.task("default", ["merge-minify-js", "merge-minify-css"]);

Translate
smacdonald2008
Level 10
Mar 1, 2019 1:20 PM UTC

WHy are you not using the Maven Archetype as discussed here:

Getting Started with AEM Sites Chapter 1 - Project Setup

This is what Adobe recommends. 

Translate