Moment.js module bundle (see jenkins-js-modules).
Note: DEPRECATED This JavaScript library can now be easily externalized via the package.json.
import
this bundle (see jenkins-js-modules) into your application bundle (in your plugin etc) instead of bundling
Moment.js in your application bundle, making your app bundle considerably lighter.
HPI Dependency
Your plugin needs to add a dependency on this plugin (to ensure it gets installed in Jenkins).
<artifactItem>
<groupId>org.jenkins-ci.ui</groupId>
<artifactId>momentjs</artifactId>
<version>[VERSION]</version>
</artifactItem>
See wiki.jenkins-ci.org to get the latest version.
Using Moment.js v2:
- Bundle Id:
momentjs:momentjs2
There are 2 ways of using momentjs:momentjs2
in your app bundle:
- Normal
require
syntax (synchronous) on the standardmoment
NPM module, and then using awithExternalModuleMapping
instruction (jenkins-js-builder) in the app bundle'sgulpfile.js
. - Lower level
import
syntax (asynchronous).
require
(sync)
If using jenkins-js-builder to create yor application bundle, you can code your application's CommonJS modules to
use the more simple CommonJS style require
syntax (synch), as opposed to the lower level import
syntax (async)
of jenkins-js-modules.
When doing it this way, your module code should require the moment
NPM module and use it as normal e.g.
var moment = require('moment');
moment().format('MMMM Do YYYY, h:mm:ss a');
Note: You should install
moment
as a dev dependency i.e.npm install --save-dev moment
The above code will work fine as is, but the only downside is that your app bundle will be very bloated as it will
include the moment
NPM module. To lighten your bundle for the browser (by using a shared instance of the moment
NPM module), use jenkins-js-builder to create your app bundle (in your gulpfile.js
), telling it to "map" (transform) all
synchronous require
calls for moment
to async import
s of the momentjs:momentjs2
bundle (which actually export
s moment
) e.g.
var builder = require('jenkins-js-builder');
//
// Use the predefined tasks from jenkins-js-builder.
//
builder.defineTasks(['test', 'bundle']);
//
// Create the app bundle, mapping sync require calls for 'moment' to
// async imports of 'momentjs:momentjs2'.
//
builder.bundle('src/main/js/myapp.js')
.withExternalModuleMapping('moment', 'momentjs:momentjs2')
.inDir('src/main/webapp/bundles');
All of the above "magically" translates the appropriate bits of your app bundle's JS code to use async import
calls
(see below) in a way that just works.
import
(async)
You can also use the lower level asynchronous import
call (jenkins-js-modules) to get your moment
reference.
require('jenkins-js-modules')
.import('momentjs:momentjs2')
.onFulfilled(function(moment) {
moment().format('MMMM Do YYYY, h:mm:ss a');
});
Note: Using this async
import
approach makes unit testing of your JavaScript modules more tricky because your test scaffolding code will need to manuallyexport
themoment
module asmomentjs:momentjs2
in order for the subsequentimport
to work without failure. This is not an issue when using the synchronousrequire
approach (see above) because the bundleimport
is only introduced to the JS code as the bundle is being created.