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

Avatar

Avatar

avinasht6348431

Avatar

avinasht6348431

avinasht6348431

01-03-2019

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.
1702066_pastedImage_8.png
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.

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar

Gaurav-Behl

MVP

Total Posts

1.1K

Likes

226

Correct Answer

281

Avatar

Gaurav-Behl

MVP

Total Posts

1.1K

Likes

226

Correct Answer

281
Gaurav-Behl
MVP

01-03-2019

change

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

to

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

Answers (4)

Answers (4)

Avatar

Avatar

Gaurav-Behl

MVP

Total Posts

1.1K

Likes

226

Correct Answer

281

Avatar

Gaurav-Behl

MVP

Total Posts

1.1K

Likes

226

Correct Answer

281
Gaurav-Behl
MVP

05-03-2019

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)

Avatar

Avatar

avinasht6348431

Avatar

avinasht6348431

avinasht6348431

05-03-2019

Thanks Gaurav!

Avatar

Avatar

avinasht6348431

Avatar

avinasht6348431

avinasht6348431

04-03-2019

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?!

Avatar

Avatar

smacdonald2008

Total Posts

12.7K

Likes

1.4K

Correct Answer

2.3K

Avatar

smacdonald2008

Total Posts

12.7K

Likes

1.4K

Correct Answer

2.3K
smacdonald2008

01-03-2019

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.