Handling JavaScript Dependencies with Gradle

In the Java world and with build tools like Maven or Gradle, you are used to declarative dependency management. Simply declare which libraries and versions you need, and let the build tool download and package these libs for you. The artifacts are typically stored in an artifact repository like Archiva, Artifactory or Nexus.
What is quite common for JAR dependencies seems to be quite uncommon for JavaScript dependencies. In my experience, a lot of Java projects that have a JavaScript front end still store the JavaScript libraries in a VCS.

I recently noticed (thanks to Steffen Schäfer) that Gradle, my current build tool of choice, is capable of handling JavaScript dependencies, too.
This is how it works:

Upload your required JavaScript library with a POM to your artifact repository.

  • inside the POM, use packaging js
  • to make it a valid POM, add the javascript-maven-plugin as an extension

Here is a full sample of such a POM:

<?xml version="1.0" encoding="UTF-8"?>
<project
  xmlns="http://maven.apache.org/POM/4.0.0"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">

  <modelVersion>4.0.0</modelVersion>

  <groupId>de.oio</groupId>
  <artifactId>mylib</artifactId>
  <version>1.0.0</version>
  <packaging>js</packaging>

  <name>Some name</name>
  <description>A really nice description</description>

  <properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
  </properties>

  <build>
    <extensions>
      <extension>
        <groupId>org.codehaus.mojo</groupId>
        <artifactId>javascript-maven-plugin</artifactId>
        <version>2.0.0-alpha-1</version>
      </extension>
    </extensions>
  </build>

</project>

In your Gradle build script (build.gradle), add a new configuration js and declare your dependencies for this configuration.

configurations {
    js
}

dependencies {
    js 'de.oio:mylib:1.0.0'
}

Using configurations.js, you can access the JavaScript files as a fileset. A typical scenario is to include these JavaScript files into a WAR archive.
You can do this as follows.

apply plugin: 'war'

war {
    into('js'){
        from configurations.js
    }
}

Transitive dependencies are also supported. If mylib has a dependency to anotherlib, simply declare it in the POM of mylib:

<dependencies>
  <dependency>
    <groupId>de.oio</groupId>
    <artifactId>anotherlib</artifactId>
    <version>1.0.0</version>
  </dependency>
</dependencies>

You could also define a POM that has no corresponding artifact itself, but it includes a lot of dependencies. A use case for this could be a POM that simply includes all the JavaScript libraries that you use in all of your projects. To do so, simply create a POM with packaging pom and a dependencies block.

Short URL for this post: http://wp.me/p4nxik-2gj
This entry was posted in Build, config and deploy, Web as a Platform and tagged , , , , , . Bookmark the permalink.

Leave a Reply