Nix-ready package

.envrc

@@ -0,0 +1 @@
+use_nix

.gitignore

@@ -1,3 +1,6 @@
+!default.nix
+!.envrc
+
 .DS_Store
 node_modules
 /dist

default.nix

@@ -0,0 +1,48 @@
+with import <nixpkgs> {};
+
+let
+  artifactName = "miracle-tv-frontend";
+  version = "0.1.0";
+  src = ./.;
+  nodePkg = pkgs.nodejs-14_x;
+  yarnPkg = pkgs.yarn.override { nodejs = nodePkg; };
+  vueCliPkg = pkgs.nodePackages."@vue/cli".override { nodejs = nodePkg; };
+in mkYarnPackage rec {
+  name = "miarcle-tv-frontend";
+  inherit version src;
+
+  packageJSON = "${src}/package.json";
+  yarnLock = "${src}/yarn.lock";
+  yarnNix = "${src}/yarn.nix";
+
+  shellHook = ''
+    export PATH="$PATH:$node_modules/.bin"
+    export NODE_PATH=$NODE_PATH:$node_modules
+  '';
+
+  configurePhase = ''
+    export PATH=$PATH:$node_modules/.bin
+    export NODE_PATH=$NODE_PATH:$node_modules
+  '';
+
+  buildPhase = ''
+    ${yarnPkg}/bin/yarn --offline build
+  '';
+
+  installPhase = ''
+    mkdir -p $out/dist
+    cp -R ./dist/* $out/dist/
+  '';
+
+  distPhase = ''
+    mkdir -p $out/tarballs
+    tar -czvf $out/tarballs/${artifactName}.${version}.tar.gz $out/dist/*
+  '';
+
+  nativeBuildInputs = with pkgs; [
+    nodePkg yarnPkg vueCliPkg
+    makeWrapper yarn2nix
+    automake autoconf m4 git bash
+    libpng libGL gcc
+  ];
+}

package.json

@@ -9,13 +9,6 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "vue": "^2.6.11",
-    "vue-class-component": "^7.2.3",
-    "vue-property-decorator": "^8.4.2",
-    "vue-router": "^3.2.0",
-    "vuex": "^3.4.0"
-  },
-  "devDependencies": {
     "@types/chai": "^4.2.11",
     "@types/mocha": "^5.2.4",
     "@typescript-eslint/eslint-plugin": "^2.33.0",
@@ -33,7 +26,13 @@
     "eslint": "^6.7.2",
     "eslint-plugin-import": "^2.20.2",
     "eslint-plugin-vue": "^6.2.2",
+    "tslib": "^2.0.1",
     "typescript": "~3.9.3",
-    "vue-template-compiler": "^2.6.11"
+    "vue": "^2.6.11",
+    "vue-class-component": "^7.2.3",
+    "vue-property-decorator": "^8.4.2",
+    "vue-router": "^3.2.0",
+    "vue-template-compiler": "^2.6.11",
+    "vuex": "^3.4.0"
   }
 }

result

@@ -0,0 +1 @@
+/nix/store/qf8l5sz28bfkx57ixbxmmmhn920j36ia-miarcle-tv-frontend

yarn.lock

@@ -7734,6 +7734,11 @@ tslib@^1.8.0, tslib@^1.8.1, tslib@^1.9.0:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.13.0.tgz#c881e13cc7015894ed914862d276436fa9a47043"
   integrity sha512-i/6DQjL8Xf3be4K/E6Wgpekn5Qasl1usyw++dAA35Ue5orEn65VIxOA+YvNNl9HV3qv70T7CNwjODHZrLwvd1Q==
 
+tslib@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.0.1.tgz#410eb0d113e5b6356490eec749603725b021b43e"
+  integrity sha512-SgIkNheinmEBgx1IUNirK0TUD4X9yjjBRTqqjggWCU3pUEqIk3/Uwl3yRixYKT6WjQuGiwDv4NomL3wqRCj+CQ==
+
 tslint@^5.20.1:
   version "5.20.1"
   resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.20.1.tgz#e401e8aeda0152bc44dd07e614034f3f80c67b7d"