npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

webjarver

v1.0.1

Published

Automates WebJars version handling for Spring Boot applications when using LiveReload and Grunt build stack.

Downloads

1

Readme

WebJarVer

This package is intended to be used in projects having a Java backend that use Maven for build and WebJars to handle Javascript libraries. WebJars pack Javascript libraries in paths which include the version number of the library like this:

<script type="text/javascript" src="webjars/angularjs/1.3.14/angular.min.js"></script>

It's also necessary to have the version number in the pom dependency:

  <dependency>
    <groupId>org.webjars</groupId>
    <artifactId>angularjs</artifactId>
    <version>1.3.14</version>
  </dependency>

This setup allows to run a Grunt server with Livereload and a proxy during development, but requires to keep the version numbers in at least two diferent files.

To avoid problems with unsynchronized version numbers, I choose to let Maven handle it. Version numbers are written as properties in the pom and Maven resource filtering takes care of replacing their references in HTML files that reference the libraries.

Dependencies in pom.xml are written like this:

<properties>
  <angularjs.version>1.3.14</angular.version>
</properties>

<dependencies>
  <dependency>
    <groupId>org.webjars</groupId>
    <artifactId>angularjs</artifactId>
    <version>${angularjs.version}</version>
  </dependency>
</dependencies>

The Javascript library can be referenced as such:

<script type="text/javascript" src="webjars/angularjs/${angularjs.version}/angular.min.js"></script>

It also necessary to include a filtering configuration in pom.xml. This example assumes that webapp static resources are at src/main/resources/public following one of Spring Boot's conventions:

<build>
	<resources>
		<resource>
			<directory>src/main/resources</directory>
			<filtering>false</filtering>
		</resource>
		<resource>
      <directory>src/main/resources/public</directory>
      <filtering>true</filtering>
      <includes>
        <include>**/*.html</include>
      </includes>
    </resource>
	</resources>
</build>

Installation

Install like any other npm package:

npm install webjarver

Usage

In Gruntfile. js, the middleware property of livereload middleware function should load pom.xml and insert WebJarVer in the middleware array.

Here is an example:

grunt.initConfig({
	connect : {
		livereload : {
			options : {
				middleware : function(connect) {
					
					var proxySnippet = require('grunt-connect-proxy/lib/utils').proxyRequest;

					// Load webjarver library using RequireJS
					var webjarver = require('webjarver');

					// Load pom.xml passing its full path.
					webjarver.loadPom(__dirname + '/pom.xml');

					return [
						proxySnippet,
						require('grunt-contrib-livereload/lib/utils').livereloadSnippet,

						// Load WebJarVer middleware. __It must be inserted after Livereload's livereloadSnippet.__
						webjarver.connectMiddleware
					];
				}
			}
		}
	}
});

Roadmap

  1. Convert into a Grunt task to reload version numbers when watch detects a pom.xml change.
  2. Add a task to integrate into Grunt build.

Change Log

  • 1.0.0 - initial release. Connect middleware to be used with LiveReload.