chore: do Tailwind build at Heroku deploy (hedyorg#933)

We do a minimized Tailwind build: this strips away CSS classes that we
don't use, and makes the difference between a CSS file of 40kB and 2MB (!).

However, it's annoying during development, because anytime you
experiment with using a new Tailwind class you have to remember to
re-generate the CSS files.

Instead, we'll just commit the full Tailwind source file of 2MB into
development, and do the optimized build automatically during Heroku
deployent. That way, the CSS is still efficient in production but the
developer experience is better.

build-tools/on-deploy.sh

@@ -0,0 +1,23 @@
+#!/bin/bash
+#----------------------------------------------------------------------
+#
+# Build script that gets run when the app is deployed to Heroku.
+#
+# Performs some build/compilation/optimization steps that are necessary
+# for deploying an efficient application, and do it always so developers
+# don't have to remember to do it before committing.
+#
+#----------------------------------------------------------------------
+#
+# This build script requires that the 'heroku/nodejs' buildpack has been added
+# to the application, and is driven from '../package.json'.
+#
+#----------------------------------------------------------------------
+set -eu
+
+# Do a minimizing build of Tailwind. Generates the tailwind css, and strip
+# all CSS classes that aren't used in our application (determined by searching
+# for CSS classes in the HTML templates and JavaScript files).
+
+echo '-----> Doing a Tailwind build'
+tailwind/generate-css

package.json

@@ -0,0 +1,18 @@
+{
+  "name": "hedy",
+  "private": true,
+  "version": "0.0.1",
+  "description": "This file exists to bring in NPM dependencies and orchestrate deploy-time build commands.",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Felienne/hedy.git"
+  },
+  "scripts": {
+      "build": "build-tools/on-deploy.sh"
+  },
+  "devDependencies": {
+    "minify": "^7.0.1",
+    "tailwindcss": "^1.9.6"
+  },
+  "license": "ISC"
+}

tailwind/generate-css

@@ -3,9 +3,6 @@ set -eu
 scriptdir=$(cd $(dirname $0) && pwd)
 cd $scriptdir
 
-# Install the dependencies at the versions indicated by package.json and package-lock.json
-npm install
-
 npx tailwindcss build styles.css -o ../static/css/generated.css
 npx minify ../static/css/generated.css > ../static/css/generated.css.min
 mv ../static/css/generated.css{.min,}