Add Caching Action for Dependencies and Update Workflow

.github/actions/cache-deps/action.yml

@@ -0,0 +1,28 @@
+name: "Get & Cache Dependencies"
+description: "Get the dependencies (via npm) and cache them for later use."
+inputs:
+  caching:
+    description: "Whether to cache the dependencies or not."
+    required: false
+    default: "true"
+outputs:
+  used-cache:
+    description: "Whether the cache was used or not."
+    value: ${{ steps.install.outputs.cache }}
+runs:
+  using: "composite"
+  steps:
+    - name: Cache dependencies
+      uses: actions/cache@v4
+      if: inputs.caching == 'true'
+      id: cache
+      with:
+        path: node_modules
+        key: deps-node-modules-${{ hashFiles('**/package-lock.json') }}
+    - name: Install dependencies
+      id: install
+      if: steps.cache.outputs.cache-hit != 'true' || inputs.caching != 'true'
+      shell: bash
+      run: |
+        npm ci
+        echo "cache='${{ inputs.caching }}'" >> $GITHUB_OUTPUT

.github/workflows/build.yml

@@ -16,8 +16,10 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: "20.11.1"
-      - name: Install dependencies
-        run: npm install
+      - name: Load & cache dependencies
+        uses: ./.github/actions/cached-deps
+        with:
+          caching: "false"
       - name: Run tests
         run: npm test
   build:
@@ -30,8 +32,11 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: "20.11.1"
-      - name: Install dependencies
-        run: npm install
+      - name: Load & cache dependencies
+        id: chached-deps
+        uses: ./.github/actions/cached-deps
+      - name: Output information
+        run: echo "Cache used? ${{ steps.chached-deps.outputs.used-cache }}"
       - name: Build the application
         run: npm run build
       - name: Upload artifacts

.vscode/settings.json

@@ -5,6 +5,10 @@
   "material-icon-theme.files.associations": {
     ".tool-versions": "nodejs_alt"
   },
+  "material-icon-theme.folders.associations": {
+    "actions": "gh-workflows",
+    "cache-deps": "temp"
+  },
   "tailwindCSS.experimental.classRegex": [
     ["[cC]lasses\\s*\\+?=\\s*([^;]*);", "'([^']*)'"],
     ["[cC]lasses\\s*\\+?=\\s*([^;]*);", "\"([^\"]*)\""],