Purescript with Vue.js - Using Nix

Posted on by Mandla Mbuli

Nix is a sunk cost which I use to deploy my applications. I started using it after I was super irritated with Docker. If it is working fine okay so far. I hope it never breaks catastrophically, or maybe I do.

What I need

I deploy the application using NixOps, so I need to be able `build the application using nix`. This just means being able run nix-build and have a result/dist which contains the output of yarn build.

Using node with nix

My search of the web returned 2 possible options for node with nix: node2nix and yarn2nix. I installed both using home-manager and gave them a try, starting with node2nix.

node2nix

I tried this one first. I ended up not using it simply because from reading the README, I couldn’t figure out how get the dist directory out. It looked like it is meant for libraries. I gave it a try anyway, but I it overrode my hello-world default.nix. There was a comment not to modify they generated the default.nix file. I didn’t like this. I also couldn’t figure out how to run yarn build and get the dist directory into the result. So I looked at yarn2nix.

yarn2nix

This one didn’t override my default.nix, so off to a good start. The short README also gave hope cause it seemed simple to get an node/hapi app working. I then searched for a way to run yarn build and get the dist directory into the result. I ended up using:

{ pkgs ? import <nixpkgs> {} }:
with pkgs;

mkYarnPackage rec {
name = "figgus-client";
src = ./.;
packageJSON = ./package.json;
yarnLock = ./yarn.lock;
extraBuildInputs = [ pkgs.purescript ];
distPhase = ''
    # pack command ignores cwd option
    rm -f .yarnrc
    cd $out/libexec/${name}/deps/${name}
    yarn build --offline
    cp --recursive dist $out/
'';
}

The distPhase I first copied from the default.nix in the yarn2nix project and modified it to have yarn build and the copying to $out. I also install purescript with extraBuildInputs.

These changes were made in: figgus