Add scripts to package.json and delete Makefile

.github/workflows/deploy.yml

@@ -3,7 +3,7 @@ name: Deploy VitePress site to Pages
 on:
   # Runs on pushes targeting the `main` branch.
   push:
-    branches: [main]
+    branches: [npm-scripts]
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:
@@ -40,11 +40,11 @@ jobs:
         with:
           ocaml-compiler: 5.1.1
       - name: Install all deps
-        run: make install
+        run: npm run install-opam-npm
       - name: Format check
-        run: make format-check
+        run: npm run format-check
       - name: Bundle the demo app
-        run: make bundle
+        run: npm run bundle
       - name: Install dependencies for VitePress
         run: |
           cd docs

README.md

@@ -6,52 +6,29 @@ Developers](https://react-book.melange.re/).
 ## Quick Start
 
 ```shell
-make init
+npm run init
 
 # In separate terminals:
-make watch
-make serve
-```
-
-When running `make init`, you may encounter an error like this:
-
-```
-[ERROR] Could not determine which packages to install for this switch:
-  * Missing dependency:
-    - melange >= 3.0.0-51
-    no matching version
-```
-
-To address this, first run `opam update`, then rerun `make init`.
-
-## Serving apps
-
-By default, running `make serve` will serve the Counter app located in
-`src/counter`. To run another app, you can `cd` into its directory and run
-`make serve` there. For example, to run the Celsius Converter app:
-
-```
-cd src/celsius-converter-option
-make serve
-```
-
-Another way is to specify the name of the app via the `app` environment variable
-before running `make serve` in the root directory, e.g.
-
-```
-app=celsius-converter-option make serve
+npm run watch
+npm run serve
 ```
 
 ## Commands
 
-You can see all available commands by running `make help` or just `make`. Here
+All the build commands are defined in the `scripts` field of `package.json`.
+This is completely optional, and other tools like `make` could be used.
+
+You can see all available commands by running `npm run`. There are explanations
+of each command in the `scriptsComments` field of the `package.json` file. Here
 are a few of the most useful ones:
 
-- `make init`: set up opam local switch and download OCaml, Melange and
+- `npm run init`: set up opam local switch and download OCaml, Melange and
 JavaScript dependencies
-- `make install`: install OCaml, Melange, and JavaScript dependencies
-- `make watch`: watch the filesystem and have Melange rebuild on every change
-- `make serve`: Serve an application using a local HTTP server
+- `npm run install-opam-npm`: install OCaml, Melange, and JavaScript
+  dependencies
+- `npm run watch`: watch the filesystem and have Melange rebuild on every
+change
+- `npm run serve`: serve the application with a local HTTP server
 
 ## Book
 

package.json

@@ -1,4 +1,36 @@
 {
+  "scripts": {
+    "preinstall-opam": "opam update",
+    "install-opam": "opam install -y . --deps-only --with-test",
+    "check-npm-deps": "opam exec opam-check-npm-deps",
+    "init": "opam switch create . 5.1.1 -y --deps-only && npm run install-opam-npm",
+    "install-opam-npm": "npm install && npm run install-opam && npm run check-npm-deps",
+    "dune": "opam exec -- dune",
+    "build": "npm run dune -- build",
+    "build-verbose": "npm run build -- --verbose",
+    "clean": "npm run dune -- clean",
+    "format": "npm run format-check -- --auto-promote",
+    "format-check": "npm run dune -- build @fmt",
+    "watch": "npm run build -- --watch",
+    "serve": "vite serve --open",
+    "bundle": "npm run build && vite build"
+  },
+  "scriptsComments": {
+    "preinstall-opam": "# Sync opam database with upstream repositories: https://opam.ocaml.org/doc/Usage.html#opam-update",
+    "install-opam": "# Downloads, builds and installs opam pkgs: https://opam.ocaml.org/doc/Usage.html#opam-install",
+    "check-npm-deps": "# Checks that Melange bindings have their JS dependencies available: https://github.com/ahrefs/opam-check-npm-deps",
+    "init": "# Create opam switch: https://opam.ocaml.org/doc/Usage.html#opam-switch and prepare everything to work in development mode (run just once, for initialization)",
+    "install-opam-npm": "# Install both opam and npm deps",
+    "dune": "# Run dune, OCaml's build tool",
+    "build": "# Build the Melange apps",
+    "build-verbose": "# Build the Melange apps in verbose mode",
+    "clean": "# Cleans all Melange artifacts",
+    "format": "# Formats the Melange sources using ocamlformat",
+    "format-check": "# Checks that the Melange sources have the right formatting (read-only)",
+    "watch": "opam exec -- dune build --watch @react @node",
+    "serve": "# Serves the React app in a local server",
+    "bundle": "# Bundle the JavaScript apps generated by Melange"
+  },
   "dependencies": {
     "react": "^18.2.0",
     "react-dom": "^18.2.0"