Maven pistää AngularJS:n Grunttimaan

Viime aikoina olen viettänyt enemmänkin aikaa JavaScriptin uuden aallon kirjastojen parissa, joista nimekkäimpiä varmaan AngularJS. Toisin kuin ennen vanhaan, JavaScriptiä ei nykyisellään van kirjoiteta. Siihen liittyy minifiointia, uglifiointia, tyylisivujen prosessointia, ja se on kasvanut vaatimaan build työkaluja kuten Javakin.

Grunt on yksi AngularJS:n suosituimpia build välineitä, se on vastaava kapistus kuin Maven Javalle jotakuinkin, ja aika nerokaskin. Mutta entäpä jos haluttaisiin saada aikaan yksi buildi CI palvelimelle, jossa voi kerralla tehdä asennukset, testaukset ja muut?

Maven tukee Grunt buildin ajoa moninkin tavoin, löysin lukuisia plug-ineita siihen ja Mavenhan kykenee ajamaan maven exec ja antrun taskien avulla muutenkin mitä vain komentoriviltä. Mutta haaviin jäi itselleni lopulta Eirslett Maven plug-in joka jotakuinkin teki kaiken mitä tarvitsin. Vaihtoehtoja oli monia, yksi mikä tässä houkutti oli fiksu tapa kyetä ajamaan npm ja grunt taskit ilman globaalia asennusta, joka taas saa buildit sujumaan CI palvelimella ilman kummempia kikkailuja.

https://github.com/eirslett/frontend-maven-plugin

Muita vaihtoehtoja mitä katsoin tässä, etenkin ensimmäinen näistä, Allegro plug-in, oli lupaava:

https://github.com/allegro/grunt-maven-plugin

http://addyosmani.com/blog/making-maven-grunt/

No niin, tein siis Maven Java web app pohjan, otin siis Eirslett plug-inin käyttöön build-osiossa näin:

<plugin>
 <groupId>com.github.eirslett</groupId>
 <artifactId>frontend-maven-plugin</artifactId>
 <version>0.0.14</version>
 <configuration>
 <workingDirectory>src/main/frontend</workingDirectory>
 </configuration>
 <executions>
   <execution>
     <id>install node and npm</id>
     <goals>
       <goal>install-node-and-npm</goal>
     </goals>
     <configuration>
       <nodeVersion>v0.11.12</nodeVersion>
       <npmVersion>1.4.6</npmVersion>
     </configuration>
   </execution>
   <execution>
     <id>npm install</id>
     <goals>
       <goal>npm</goal>
     </goals>
   </execution>
   <execution>
     <id>grunt build</id>
     <goals>
       <goal>grunt</goal>
     </goals>
     <configuration>
       <arguments>${grunt.args}</arguments>
     </configuration>
   </execution> 
  </executions>
  </plugin>
</plugins>

Tuossa listassa on huomattavaa lähinnä grunt.args muuttuja, joka on asetettu ylempänä näin:

<properties>
 <endorsed.dir>${project.build.directory}/endorsed</endorsed.dir>
 <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
 <grunt.args>debug --no-color</grunt.args>
 </properties>

… mutta sen voi myös komentoriviltä ja Netbeansistä asettaa esim.

mvn -Dgrunt.args=release clean install

Cool stuff? Jenkins rouskuttaa ihan iloisesti nyt niin Java server-side kuin AngularJS kilkkeetkin yhdessä synkassa, ajaen myös testit.

 

 

Advertisements

Vastaa

Täytä tietosi alle tai klikkaa kuvaketta kirjautuaksesi sisään:

WordPress.com-logo

Olet kommentoimassa WordPress.com -tilin nimissä. Log Out / Muuta )

Twitter-kuva

Olet kommentoimassa Twitter -tilin nimissä. Log Out / Muuta )

Facebook-kuva

Olet kommentoimassa Facebook -tilin nimissä. Log Out / Muuta )

Google+ photo

Olet kommentoimassa Google+ -tilin nimissä. Log Out / Muuta )

Muodostetaan yhteyttä palveluun %s