compose playground settings into a single workspace

Author: cometkim

.github/workflows/ci.yml

@@ -405,21 +405,18 @@ jobs:
 
       - name: Build playground compiler
         if: matrix.build_playground
-        run: |
-          opam exec -- node packages/playground-bundling/scripts/generate_cmijs.js
-          opam exec -- dune build --profile browser
-          cp ./_build/default/compiler/jsoo/jsoo_playground_main.bc.js playground/compiler.cjs
+        run: opam exec -- make playground playground-cmijs
 
       - name: Test playground compiler
         if: matrix.build_playground
-        run: node playground/playground_test.cjs
+        run: yarn workspace playground test
 
       - name: Upload playground compiler to CDN
         if: ${{ matrix.build_playground && startsWith(github.ref, 'refs/tags/v') }}
         env:
           KEYCDN_USER: ${{ secrets.KEYCDN_USER }}
           KEYCDN_PASSWORD: ${{ secrets.KEYCDN_PASSWORD }}
-        run: bash playground/upload_bundle.sh
+        run: yarn workspace playground upload-bundle
 
       - name: "Upload artifacts: binaries"
         if: matrix.upload_binaries
@@ -576,5 +573,5 @@ jobs:
       - name: Update Website Playground
         env:
           NEXT_REVALIDATE_SECRET_TOKEN: ${{ secrets.NEXT_REVALIDATE_SECRET_TOKEN }}
-        run: ./playground/website_update_playground.sh
+        run: yarn workspace playground revalidate
         shell: bash

CONTRIBUTING.md

@@ -241,39 +241,39 @@ make playground
 make playground-cmijs
 ```
 
-Note that building the cmijs is based on the dependencies defined in `packages/playground-bundling/package.json`. In case you want to build some different version of e.g. `@rescript/react` or just want to add a new package, change the definition within the `package.json` file and run `make playground-cmijs` again.
+Note that building the cmijs is based on the dependencies defined in `packages/playground/package.json`. In case you want to build some different version of e.g. `@rescript/react` or just want to add a new package, change the definition within the `package.json` file and run `yarn workspace playground build` again.
 
 After a successful compilation, you will find following files in your project:
 
 - `playground/compiler.js` -> This is the ReScript compiler, which binds the ReScript API to the `window` object.
-- `playground/packages` -> Contains third party deps with cmij.js files (as defined in `packages/playground-bundling/bsconfig.json`)
-- `playground/compilerCmij.js` -> The compiler base cmij containing all the relevant core modules (`Js`, `Belt`, `Pervasives`, etc.)
+- `playground/packages/compiler-builtins` -> The compiler base cmij containing all the relevant core modules (`Js`, `Belt`, `Pervasives`, etc.)
+- `playground/packages/*` -> Contains third party deps with cmij.js files (as defined in `packages/playground/rescript.json`)
 
 You can now use the `compiler.js` file either directly by using a `<script src="/path/to/compiler.js"/>` and `<script src="/path/to/packages/compilerCmij.js"/>` inside a html file, use a browser bundler infrastructure to optimize it, or use `nodejs` to run it on a command line:
 
 ```
 $ node
-> require("./compiler.js");
-> require("./packages/compilerCmij.js")
-> let compiler = rescript_compiler.make()
-> let result = compiler.rescript.compile(`Js.log(Sys.ocaml_version)`);
+> let { rescript_compiler } = require("./compiler.js");
+> require("./packages/compiler-builtins/cmij.js")
+> let { rescript } = rescript_compiler.make()
+> let result = rescript.compile(`Console.log(${rescript.version})`);
 > eval(result.js_code);
-4.06.2+BS
 ```
 
 ### Testing the Playground bundle
 
-Run `node playground/playground_test.cjs` for a quick sanity check to see if all the build artifacts are working together correctly. When releasing the playground bundle, the test will always be executed before publishing to catch regressions.
+Run `yarn workspace playground test` for a quick sanity check to see if all the build artifacts are working together correctly. When releasing the playground bundle, the test will always be executed before publishing to catch regressions.
 
 ### Working on the Playground JS API
 
 Whenever you are modifying any files in the ReScript compiler, or in the `jsoo_playground_main.ml` file, you'll need to rebuild the source and recreate the JS bundle.
 
 ```
 make playground
+yarn workspace playground build
 
 # optionally run your test / arbitrary node script to verify your changes
-node playground/playground_test.cjs
+yarn workspace playground test
 ```
 
 ### Publishing the Playground Bundle on our KeyCDN

Makefile

@@ -61,17 +61,17 @@ artifacts: lib
 # Builds the core playground bundle (without the relevant cmijs files for the runtime)
 playground:
 	dune build --profile browser
-	cp ./_build/default/compiler/jsoo/jsoo_playground_main.bc.js playground/compiler.cjs
+	cp ./_build/default/compiler/jsoo/jsoo_playground_main.bc.js packages/playground/compiler.js
 
 # Creates all the relevant core and third party cmij files to side-load together with the playground bundle
 playground-cmijs: artifacts
-	node packages/playground-bundling/scripts/generate_cmijs.js
+	yarn workspace playground build
 
 # Builds the playground, runs some e2e tests and releases the playground to the
 # CDN (requires KEYCDN_USER and KEYCDN_PASSWORD set in the env variables)
 playground-release: playground playground-cmijs
-	node playground/playground_test.cjs
-	sh playground/upload_bundle.sh
+	yarn workspace playground test
+	yarn workspace playground upload-bundle
 
 format:
 	bash scripts/format.sh

packages/playground-bundling/.gitignore renamed to packages/playground/.gitignore

@@ -25,8 +25,10 @@ lib/bs
 .merlin
 .bsb.lock
 /node_modules/
-lib/
-packages/
+/lib/
 .DS_Store
 package-lock.json
 yarn.lock
+
+/packages/
+/compiler.js

packages/playground-bundling/README.md renamed to packages/playground/README.md

@@ -1,31 +1,17 @@
-# rescript-compiler-js
+# ReScript Playground bundle
 
-This repo is useful to generate a bunch of cmij.js files for a list of dependencies ready to be used in the ReScript playground.
+This repo is useful to generate a bunch of `cmij.js` files for a list of dependencies ready to be used in the ReScript playground.
 
 ## Setup
 
-Check the `bsconfig.json` and `package.json` files for the respective versions used for the compiler & packages.
-
-It's useful to `npm link` the compiler locally to prevent mismatching compiler versions and therefore "stale artifact" warnings.
-
-```
-# Go to the root of the rescript-compiler project
-cd ../..
-
-npm link
-
-# Link the local build in this project as well
-cd packages/playground-bundling
-npm link rescript
-```
+Check the `rescript.json` and `package.json` files for the respective versions used for the compiler & packages.
 
 ## Building
 
-Run the following commands:
+Run the following command:
 
 ```
-npm run build
-node scripts/generate_cmijs.js
+yarn workspace playground build
 ```
 
 All the cmij files will now be available in the `packages/` directory with a structure like this:
@@ -55,12 +41,13 @@ packages
 Let's assume our `compiler.js` file represents our playground bundle, you'd first load the compiler, and then load any cmij file:
 
 ```
-require("playground/compiler.js")
-require("packages/@rescript/react/cmij.js")
+const { rescript_compiler } = require("./compiler.js");
 
-let comp = rescript_compiler.make()
-comp.rescript.compile("let a = <div/>")
+require("./packages/compiler-builtins/cmij.js");
+require("./packages/@rescript/react/cmij.js");
+
+let comp = rescript_compiler.make();
+comp.rescript.compile("let a = <div/>");
 ```
 
 The script above will be able to successfully compile this React code, since all the `React` module functionality required by JSX was injected in the compiler's state.
-

packages/playground-bundling/package.json renamed to packages/playground/package.json

@@ -1,11 +1,13 @@
 {
   "private": true,
-  "name": "playground-bundling",
-  "type": "module",
+  "name": "playground",
+  "type": "commonjs",
   "scripts": {
-    "build": "rescript clean && rescript build && node ./scripts/generate_cmijs.js",
-    "bundle": "rollup -c",
-    "clean": "rescript clean"
+    "clean": "rescript clean",
+    "test": "node ./playground_test.cjs",
+    "build": "rescript clean && rescript build && node ./scripts/generate_cmijs.mjs && rollup -c",
+    "upload-bundle": "./scripts/upload_bundle.sh",
+    "revalidate": "./scripts/website_update_playground.sh"
   },
   "dependencies": {
     "@rescript/react": "^0.13.1",

playground/playground_test.cjs renamed to packages/playground/playground_test.cjs

@@ -1,9 +1,9 @@
 // Playground bundle is UMD module
 // It uses `module.exports` in current context, or fallback to `globalThis`
-const { rescript_compiler } = require("./compiler.cjs");
+const { rescript_compiler } = require("./compiler.js");
 
-require("./packages/compiler-builtins/cmij.cjs");
-require("./packages/@rescript/react/cmij.cjs");
+require("./packages/compiler-builtins/cmij.js");
+require("./packages/@rescript/react/cmij.js");
 
 const compiler = rescript_compiler.make();
 

packages/playground-bundling/rescript.json renamed to packages/playground/rescript.json

@@ -1,14 +1,16 @@
 {
   "name": "playground",
   "version": "0.1.0",
-  "bs-dependencies": ["@rescript/react"],
-  "package-specs": {
-    "module": "esmodule",
-    "in-source": false
-  },
   "sources": {
     "dir": "src",
     "subdirs": true
   },
-  "uncurried": true
+  "package-specs": {
+    "module": "esmodule",
+    "in-source": false,
+    "suffix": ".res.js"
+  },
+  "bs-dependencies": [
+    "@rescript/react"
+  ]
 }

packages/playground-bundling/rollup.config.mjs renamed to packages/playground/rollup.config.mjs

@@ -4,9 +4,9 @@ import { glob } from "glob";
 
 const RESCRIPT_COMPILER_ROOT_DIR = path.join(import.meta.dirname, "..", "..");
 const LIB_DIR = path.join(RESCRIPT_COMPILER_ROOT_DIR, "lib");
-const PLAYGROUND_DIR = path.join(RESCRIPT_COMPILER_ROOT_DIR, "playground");
+
 // Final target output directory where all the cmijs will be stored
-const PACKAGES_DIR = path.join(PLAYGROUND_DIR, "packages");
+const PACKAGES_DIR = path.join(import.meta.dirname, "packages");
 const outputFolder = path.join(PACKAGES_DIR, "compiler-builtins", "stdlib");
 
 const entryPoint = await glob(`${LIB_DIR}/es6/*.js`);

packages/playground-bundling/scripts/generate_cmijs.js renamed to packages/playground/scripts/generate_cmijs.mjs

@@ -26,10 +26,8 @@ const RESCRIPT_COMPILER_ROOT_DIR = path.join(
   "..",
 );
 
-const PLAYGROUND_DIR = path.join(RESCRIPT_COMPILER_ROOT_DIR, "playground");
-
 // The playground-bundling root dir
-const PROJECT_ROOT_DIR = path.join(import.meta.dirname, "..");
+const PLAYGROUND_DIR = path.join(import.meta.dirname, "..");
 
 // Final target output directory where all the cmijs will be stored
 const PACKAGES_DIR = path.join(PLAYGROUND_DIR, "packages");
@@ -43,14 +41,13 @@ fs.mkdirSync(PACKAGES_DIR, { recursive: true });
 function e(cmd) {
   console.log(`>>>>>> running command: ${cmd}`);
   child_process.execSync(cmd, {
-    cwd: PROJECT_ROOT_DIR,
+    cwd: PLAYGROUND_DIR,
     encoding: "utf8",
     stdio: [0, 1, 2],
   });
   console.log("<<<<<<");
 }
 
-e("yarn install");
 e("yarn rescript clean");
 e("yarn rescript");
 
@@ -68,7 +65,7 @@ function buildCompilerCmij() {
   const outputFolder = path.join(PACKAGES_DIR, "compiler-builtins");
   fs.mkdirSync(outputFolder, { recursive: true });
 
-  const cmijFile = path.join(outputFolder, "cmij.cjs");
+  const cmijFile = path.join(outputFolder, "cmij.js");
 
   e(
     `find ${rescriptLibOcamlFolder} -name "*.cmi" -or -name "*.cmj" | xargs -n1 basename | xargs js_of_ocaml build-fs -o ${cmijFile} -I ${rescriptLibOcamlFolder}`,
@@ -94,7 +91,7 @@ function buildThirdPartyCmijs() {
     const outputFolder = path.join(PACKAGES_DIR, pkg);
     fs.mkdirSync(outputFolder, { recursive: true });
 
-    const cmijFile = path.join(outputFolder, "cmij.cjs");
+    const cmijFile = path.join(outputFolder, "cmij.js");
 
     e(`find ${libEs6Folder} -name '*.js' -exec cp {} ${outputFolder} \\;`);
     e(
@@ -103,10 +100,5 @@ function buildThirdPartyCmijs() {
   }
 }
 
-function bundleStdlibJs() {
-  e("yarn bundle");
-}
-
 buildCompilerCmij();
 buildThirdPartyCmijs();
-bundleStdlibJs();

playground/upload_bundle.sh renamed to packages/playground/scripts/upload_bundle.sh

@@ -1,13 +1,14 @@
-#!/bin/bash
+#!/usr/bin/env bash
 
 # This script will publish the compiler.js bundle / packages cmij.js files to our KeyCDN server.
 # The target folder on KeyCDN will be the compiler.js' version number.
 # This script requires `curl` / `openssl` to be installed.
 
-SCRIPT_DIR=$(cd "$(dirname "$0")"; pwd -P)
+SCRIPT_PATH=${BASH_SOURCE[0]}
+SCRIPT_DIR=$(dirname "$(dirname "$current_script_path")")
 
 # Get the actual version from the compiled playground bundle
-VERSION=$(cd $SCRIPT_DIR; node -e 'require("./compiler.js"); console.log(rescript_compiler.make().rescript.version)')
+VERSION=$(cd $SCRIPT_DIR; node -e 'require("/compiler.js"); console.log(rescript_compiler.make().rescript.version)')
 
 if [ -z "${KEYCDN_USER}" ]; then
   echo "KEYCDN_USER environment variable not set. Make sure to set the environment accordingly."

playground/website_update_playground.sh renamed to packages/playground/scripts/website_update_playground.sh

@@ -1,4 +1,4 @@
-#/usr/bin/sh
+#!/usr/bin/env bash
 
 if [ -z "${NEXT_REVALIDATE_SECRET_TOKEN}" ]; then
   echo "NEXT_REVALIDATE_SECRET_TOKEN environment variable not set."

packages/playground-bundling/src/App.res renamed to packages/playground/src/App.res

@@ -2340,9 +2340,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"playground-bundling@workspace:packages/playground-bundling":
+"playground@workspace:packages/playground":
   version: 0.0.0-use.local
-  resolution: "playground-bundling@workspace:packages/playground-bundling"
+  resolution: "playground@workspace:packages/playground"
   dependencies:
     "@rescript/react": "npm:^0.13.1"
     "@rollup/plugin-node-resolve": "npm:^16.0.0"