Custom registries in JSPM from CI

I recently ran into a bit of trouble using JSPM from the Gitlab CI build for one of my projects – in particular, I’ve started separating my shared frontend UI code (projects like vue-component-library, a small collection of homegrown, badly designed UI components), and reusing across projects.

One of the big issues I ran into was trying to run jspm build on projects that used some of the shared libraries, that were hosted on Gitlab and not Github. JSPM doesn’t support Gitlab project dependencies natively yet from, from what I understand, though you can use jspm-git to get it working. But to get a custom registry working with jspm-git, you need to install it and create/configure the registry (in my case gitab) itself.

These things also need to be done in a CI environment, and unforutnately I didn’t realize there is a fairly simple way to automatically configure registries…. If you’re trying to set up a registry, please use the jspm-cli documentation’s auto-configuring documentation.

Since I didn’t see those instructions I actually wrote a small script…

#!/usr/bin/env node

var cp = require('child_process');
console.log("INFO: Installing jspm [gitlab] registry...");
var childProcess = cp.spawn('./node_modules/.bin/jspm', ['registry', 'create', 'gitlab', 'jspm-git']);

childProcess.stdout.setEncoding('utf8');

childProcess.stdout.on("data", function(data) {
  if (/^Enter the base URL/.exec(data)) {
    childProcess.stdin.write( 'https://gitlab.com' + '\n');
  }

  if (/^Set advanced configurations?/.exec(data)) {
    childProcess.stdin.write('no\n');
    childProcess.stdin.end();
  }

  if (/^Registry gitlab already exists/.exec(data)) {
    childProcess.stdin.write('n\n');
    childProcess.stdin.end();
  }

});

Another thing I Wrote I found was that I hit the rate limits of various providers fairly quickly – This guide-gist helped immensely, though I had to adapt everything for Gitlab aftewards.

Here’s what the script to set up the personal acess token (again this wouldn’t have been necessary if I had just read the auto-configuring documentation but was fun to write) looks like:

#!/usr/bin/env node
/* global process */

if (!process.env.GITHUB_USERNAME) { throw new Error("GITHUB_USERNAME is missing"); }
if (!process.env.GITHUB_PERSONAL_ACCESS_TOKEN) { throw new Error("GITHUB_PERSONAL_ACCESS_TOKEN is missing"); }

var cp = require('child_process');
console.log("INFO: Configuring [github] registry for use by JSPM...");
var childProcess = cp.spawn('./node_modules/.bin/jspm', ['registry', 'config', 'github']);

childProcess.stdout.setEncoding('utf8');

childProcess.stdout.on("data", function(data) {
  if (/Would you like to set up your GitHub/.exec(data)) {
    childProcess.stdin.write("yes\n");
  }

  if (/Enter your GitHub username/.exec(data)) {
    console.log("Setting github username...");
    childProcess.stdin.write(`${process.env.GITHUB_USERNAME}\n`);
  }

  if (/Enter your GitHub password or access token/.exec(data)) {
    console.log("entering access token...");
    childProcess.stdin.write(`${process.env.GITHUB_PERSONAL_ACCESS_TOKEN}\n`);
  }

  if (/Would you like to test/.exec(data)) {
    console.log("answering yes to test...");
    childProcess.stdin.write("yes\n");
    childProcess.stdin.end();
  }
});

While these scripts are ultimately useless, as JSPM already has facilities for automatically configuring registies that you can use instead, these scripts did the job.

At the end of the day, the gitlab-ci.yml file looked like this:

image: node:alpine

cache:
  paths:
    - node_modules
    - jspm_packages

stages:
  - lint
  - build
  - test
  - publish

lint:
  stage: lint
  script:
    - apk add --update make git openssh
    - npm install
    - node .dev-util/configure-jspm-github-for-ci.js
    - make setup lint

build:
  stage: build
  script:
    - apk add --update make git openssh
    - npm install
    - node .dev-util/configure-jspm-github-for-ci.js
    - make setup build

unit-test:
  stage: test
  script:
    - apk add --update make git openssh
    - npm install
    - node .dev-util/configure-jspm-github-for-ci.js
    - make setup test-unit

You might notice tat the first ~3 lines of all the script sections are copied/repeated – I do this (instaed of putting them in before_script or something) because some stages/steps actually use completely different images (for example a docker_build stage), so apk or npm commands might actually not be present.

VADOSWARE

Living in a yak shaver's paradise.

Custom registries in JSPM from CI

Categories