Make packages reference each other instead of bundling everything together, release multiple packages, unify release under one command, remove release preview

.github/workflows/autorelease-excalidraw.yml

@@ -24,4 +24,4 @@ jobs:
       - name: Auto release
         run: |
           yarn add @actions/core -W
-          yarn autorelease
+          yarn release next - ci 

.github/workflows/autorelease-preview.yml

@@ -1,55 +0,0 @@
-name: Auto release excalidraw preview
-on:
-  issue_comment:
-    types: [created, edited]
-
-jobs:
-  Auto-release-excalidraw-preview:
-    name: Auto release preview
-    if: github.event.comment.body == '@excalibot trigger release' && github.event.issue.pull_request
-    runs-on: ubuntu-latest
-    steps:
-      - name: React to release comment
-        uses: peter-evans/create-or-update-comment@v1
-        with:
-          token: ${{ secrets.PUSH_TRANSLATIONS_COVERAGE_PAT }}
-          comment-id: ${{ github.event.comment.id }}
-          reactions: "+1"
-      - name: Get PR SHA
-        id: sha
-        uses: actions/github-script@v4
-        with:
-          result-encoding: string
-          script: |
-            const { owner, repo, number } = context.issue;
-            const pr = await github.pulls.get({
-              owner,
-              repo,
-              pull_number: number,
-            });
-            return pr.data.head.sha
-      - uses: actions/checkout@v2
-        with:
-          ref: ${{ steps.sha.outputs.result }}
-          fetch-depth: 2
-      - name: Setup Node.js 18.x
-        uses: actions/setup-node@v2
-        with:
-          node-version: 18.x
-      - name: Set up publish access
-        run: |
-          npm config set //registry.npmjs.org/:_authToken ${NPM_TOKEN}
-        env:
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-      - name: Auto release preview
-        id: "autorelease"
-        run: |
-          yarn add @actions/core -W
-          yarn autorelease preview ${{ github.event.issue.number }}
-      - name: Post comment post release
-        if: always()
-        uses: peter-evans/create-or-update-comment@v1
-        with:
-          token: ${{ secrets.PUSH_TRANSLATIONS_COVERAGE_PAT }}
-          issue-number: ${{ github.event.issue.number }}
-          body: "@${{ github.event.comment.user.login }} ${{ steps.autorelease.outputs.result }}"

dev-docs/docs/@excalidraw/excalidraw/development.mdx

@@ -28,32 +28,12 @@ To start the example app using the `@excalidraw/excalidraw` package, follow the
 
 ## Releasing
 
-### Create a test release
-
-You can create a test release by posting the below comment in your pull request:
-
-```bash
-@excalibot trigger release
-```
-
-Once the version is released `@excalibot` will post a comment with the release version.
-
 ### Creating a production release
 
 To release the next stable version follow the below steps:
 
 ```bash
-yarn prerelease:excalidraw
+yarn release latest 0.19.0
 ```
 
-You need to pass the `version` for which you want to create the release. This will make the changes needed before making the release like updating `package.json`, `changelog` and more.
-
-The next step is to run the `release` script:
-
-```bash
-yarn release:excalidraw
-```
-
-This will publish the package.
-
-Right now there are two steps to create a production release but once this works fine these scripts will be combined and more automation will be done.
+You will need to pass the `latest` tag with `version` for which you want to create the release. This will make the changes needed before publishing the packages into NPM, like updating dependencies of all `@excalidraw/*` packages, updating `CHANGELOG.md` and more.

package.json

@@ -76,9 +76,7 @@
     "locales-coverage:description": "node scripts/locales-coverage-description.js",
     "prepare": "husky install",
     "prettier": "prettier \"**/*.{css,scss,json,md,html,yml}\" --ignore-path=.eslintignore",
-    "autorelease": "node scripts/autorelease.js",
-    "prerelease:excalidraw": "node scripts/prerelease.js",
-    "release:excalidraw": "node scripts/release.js",
+    "release": "node scripts/release.js",
     "rm:build": "rimraf --glob excalidraw-app/build excalidraw-app/dist excalidraw-app/dev-dist packages/*/dist packages/*/build examples/*/build examples/*/dist",
     "rm:node_modules": "rimraf --glob node_modules excalidraw-app/node_modules packages/*/node_modules",
     "clean-install": "yarn rm:node_modules && yarn install"

packages/common/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@excalidraw/common",
-  "version": "0.1.0",
+  "version": "0.18.0",
   "type": "module",
   "types": "./dist/types/common/src/index.d.ts",
   "main": "./dist/prod/index.js",

packages/element/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@excalidraw/element",
-  "version": "0.1.0",
+  "version": "0.18.0",
   "type": "module",
   "types": "./dist/types/element/src/index.d.ts",
   "main": "./dist/prod/index.js",
@@ -52,5 +52,8 @@
   "scripts": {
     "gen:types": "rimraf types && tsc",
     "build:esm": "rimraf dist && node ../../scripts/buildBase.js && yarn gen:types"
+  },
+  "dependencies": {
+    "@excalidraw/common": "0.18.0"
   }
 }

packages/excalidraw/package.json

@@ -66,12 +66,22 @@
       "last 1 safari version"
     ]
   },
+  "repository": "https://github.com/excalidraw/excalidraw",
+  "bugs": "https://github.com/excalidraw/excalidraw/issues",
+  "homepage": "https://github.com/excalidraw/excalidraw/tree/master/packages/excalidraw",
+  "scripts": {
+    "gen:types": "rimraf types && tsc",
+    "build:esm": "rimraf dist && node ../../scripts/buildPackage.js && yarn gen:types"
+  },
   "peerDependencies": {
     "react": "^17.0.2 || ^18.2.0 || ^19.0.0",
     "react-dom": "^17.0.2 || ^18.2.0 || ^19.0.0"
   },
   "dependencies": {
     "@braintree/sanitize-url": "6.0.2",
+    "@excalidraw/common": "0.18.0",
+    "@excalidraw/element": "0.18.0",
+    "@excalidraw/math": "0.18.0",
     "@excalidraw/laser-pointer": "1.3.1",
     "@excalidraw/mermaid-to-excalidraw": "1.1.2",
     "@excalidraw/random-username": "1.1.0",
@@ -124,12 +134,5 @@
     "harfbuzzjs": "0.3.6",
     "jest-diff": "29.7.0",
     "typescript": "4.9.4"
-  },
-  "repository": "https://github.com/excalidraw/excalidraw",
-  "bugs": "https://github.com/excalidraw/excalidraw/issues",
-  "homepage": "https://github.com/excalidraw/excalidraw/tree/master/packages/excalidraw",
-  "scripts": {
-    "gen:types": "rimraf types && tsc",
-    "build:esm": "rimraf dist && node ../../scripts/buildPackage.js && yarn gen:types"
   }
 }

packages/math/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@excalidraw/math",
-  "version": "0.1.0",
+  "version": "0.18.0",
   "type": "module",
   "types": "./dist/types/math/src/index.d.ts",
   "main": "./dist/prod/index.js",
@@ -56,5 +56,8 @@
   "scripts": {
     "gen:types": "rimraf types && tsc",
     "build:esm": "rimraf dist && node ../../scripts/buildBase.js && yarn gen:types"
+  },
+  "dependencies": {
+    "@excalidraw/common": "0.18.0"
   }
 }

scripts/autorelease.js

@@ -1,71 +0,0 @@
-const { exec, execSync } = require("child_process");
-const fs = require("fs");
-
-const core = require("@actions/core");
-
-const excalidrawDir = `${__dirname}/../packages/excalidraw`;
-const excalidrawPackage = `${excalidrawDir}/package.json`;
-const pkg = require(excalidrawPackage);
-const isPreview = process.argv.slice(2)[0] === "preview";
-
-const getShortCommitHash = () => {
-  return execSync("git rev-parse --short HEAD").toString().trim();
-};
-
-const publish = () => {
-  const tag = isPreview ? "preview" : "next";
-
-  try {
-    execSync(`yarn  --frozen-lockfile`);
-    execSync(`yarn run build:esm`, { cwd: excalidrawDir });
-    execSync(`yarn --cwd ${excalidrawDir} publish --tag ${tag}`);
-    console.info(`Published ${pkg.name}@${tag}🎉`);
-    core.setOutput(
-      "result",
-      `**Preview version has been shipped** :rocket:
-    You can use [@excalidraw/excalidraw@${pkg.version}](https://www.npmjs.com/package/@excalidraw/excalidraw/v/${pkg.version}) for testing!`,
-    );
-  } catch (error) {
-    core.setOutput("result", "package couldn't be published :warning:!");
-    console.error(error);
-    process.exit(1);
-  }
-};
-// get files changed between prev and head commit
-exec(`git diff --name-only HEAD^ HEAD`, async (error, stdout, stderr) => {
-  if (error || stderr) {
-    console.error(error);
-    core.setOutput("result", ":warning: Package couldn't be published!");
-    process.exit(1);
-  }
-  const changedFiles = stdout.trim().split("\n");
-
-  const excalidrawPackageFiles = changedFiles.filter((file) => {
-    return (
-      file.indexOf("packages/excalidraw") >= 0 ||
-      file.indexOf("buildPackage.js") > 0
-    );
-  });
-  if (!excalidrawPackageFiles.length) {
-    console.info("Skipping release as no valid diff found");
-    core.setOutput("result", "Skipping release as no valid diff found");
-    process.exit(0);
-  }
-
-  // update package.json
-  let version = `${pkg.version}-${getShortCommitHash()}`;
-
-  // update readme
-
-  if (isPreview) {
-    // use pullNumber-commithash as the version for preview
-    const pullRequestNumber = process.argv.slice(3)[0];
-    version = `${pkg.version}-${pullRequestNumber}-${getShortCommitHash()}`;
-  }
-  pkg.version = version;
-
-  fs.writeFileSync(excalidrawPackage, JSON.stringify(pkg, null, 2), "utf8");
-
-  console.info("Publish in progress...");
-  publish();
-});

scripts/buildBase.js

@@ -17,6 +17,7 @@ const getConfig = (outdir) => ({
     "@excalidraw/math": path.resolve(__dirname, "../packages/math/src"),
     "@excalidraw/utils": path.resolve(__dirname, "../packages/utils/src"),
   },
+  external: ["@excalidraw/common", "@excalidraw/element", "@excalidraw/math"],
 });
 
 function buildDev(config) {

scripts/buildPackage.js

@@ -34,6 +34,7 @@ const getConfig = (outdir) => ({
     "@excalidraw/math": path.resolve(__dirname, "../packages/math/src"),
     "@excalidraw/utils": path.resolve(__dirname, "../packages/utils/src"),
   },
+  external: ["@excalidraw/common", "@excalidraw/element", "@excalidraw/math"],
   loader: {
     ".woff2": "file",
   },

scripts/prerelease.js

@@ -1,38 +0,0 @@
-const fs = require("fs");
-const util = require("util");
-
-const exec = util.promisify(require("child_process").exec);
-const updateChangelog = require("./updateChangelog");
-
-const excalidrawDir = `${__dirname}/../packages/excalidraw/`;
-const excalidrawPackage = `${excalidrawDir}/package.json`;
-
-const updatePackageVersion = (nextVersion) => {
-  const pkg = require(excalidrawPackage);
-  pkg.version = nextVersion;
-  const content = `${JSON.stringify(pkg, null, 2)}\n`;
-  fs.writeFileSync(excalidrawPackage, content, "utf-8");
-};
-
-const prerelease = async (nextVersion) => {
-  try {
-    await updateChangelog(nextVersion);
-    updatePackageVersion(nextVersion);
-    await exec(`git add -u`);
-    await exec(
-      `git commit -m "docs: release @excalidraw/excalidraw@${nextVersion}  🎉"`,
-    );
-
-    console.info("Done!");
-  } catch (error) {
-    console.error(error);
-    process.exit(1);
-  }
-};
-
-const nextVersion = process.argv.slice(2)[0];
-if (!nextVersion) {
-  console.error("Pass the next version to release!");
-  process.exit(1);
-}
-prerelease(nextVersion);

scripts/release.js

@@ -1,28 +1,192 @@
+const fs = require("fs");
+const path = require("path");
+
 const { execSync } = require("child_process");
 
-const excalidrawDir = `${__dirname}/../packages/excalidraw`;
-const excalidrawPackage = `${excalidrawDir}/package.json`;
-const pkg = require(excalidrawPackage);
+const updateChangelog = require("./updateChangelog");
 
-const publish = () => {
-  try {
-    console.info("Installing the dependencies in root folder...");
-    execSync(`yarn  --frozen-lockfile`);
-    console.info("Installing the dependencies in excalidraw directory...");
-    execSync(`yarn --frozen-lockfile`, { cwd: excalidrawDir });
-    console.info("Building ESM Package...");
-    execSync(`yarn run build:esm`, { cwd: excalidrawDir });
-    console.info("Publishing the package...");
-    execSync(`yarn --cwd ${excalidrawDir} publish`);
-  } catch (error) {
-    console.error(error);
+// skipping utils for now, as it has independent release process
+const PACKAGES = ["common", "element", "math", "excalidraw"];
+const PACKAGES_DIR = path.resolve(`${__dirname}/../packages`);
+
+const validatePackageName = (packageName) => {
+  if (!PACKAGES.includes(packageName)) {
+    console.error(`Package "${packageName}" not found!`);
     process.exit(1);
   }
 };
 
-const release = () => {
-  publish();
-  console.info(`Published ${pkg.version}!`);
+const getPackageJsonPath = (packageName) => {
+  validatePackageName(packageName);
+  return path.resolve(`${PACKAGES_DIR}/${packageName}/package.json`);
 };
 
-release();
+const updatePackageJsons = (nextVersion) => {
+  const packageJsons = new Map();
+
+  for (const packageName of PACKAGES) {
+    const pkg = require(getPackageJsonPath(packageName));
+
+    pkg.version = nextVersion;
+
+    if (pkg.dependencies) {
+      for (const dependencyName of PACKAGES) {
+        if (!pkg.dependencies[`@excalidraw/${dependencyName}`]) {
+          continue;
+        }
+
+        pkg.dependencies[`@excalidraw/${dependencyName}`] = nextVersion;
+      }
+    }
+
+    packageJsons.set(packageName, `${JSON.stringify(pkg, null, 2)}\n`);
+  }
+
+  // modify once, to avoid inconsistent state
+  for (const packageName of PACKAGES) {
+    const content = packageJsons.get(packageName);
+    fs.writeFileSync(getPackageJsonPath(packageName), content, "utf-8");
+  }
+};
+
+const getParams = () => {
+  // tag: test (default), next (~autorelease), latest (~stable release)
+  // version: 20.0.0 for latest, nothing for next and test
+  // ci: true or false, default is false
+  let [tag, version, ci] = process.argv.slice(2);
+
+  if (!tag) {
+    // test is default tag
+    tag = "test";
+  }
+
+  if (tag !== "latest" && tag !== "next" && tag !== "test") {
+    console.error(`Unsupported tag "${tag}", use "latest", "next" or "test".`);
+    process.exit(1);
+  }
+
+  if (tag === "latest" && !version) {
+    console.error("Pass the version to make the latest stable release!");
+    process.exit(1);
+  }
+
+  if (tag !== "latest" && version) {
+    console.error(`Do not pass the version for tag "${tag}".`);
+    process.exit(1);
+  }
+
+  if (!version || version === "-") {
+    // set the next version based on the excalidraw package version + commit hash
+    const excalidrawPackageVersion = require(getPackageJsonPath(
+      "excalidraw",
+    )).version;
+
+    const hash = getShortCommitHash();
+
+    // ensuring idempotency
+    if (!excalidrawPackageVersion.includes("hash")) {
+      version = `${excalidrawPackageVersion}-${hash}`;
+    }
+  }
+
+  console.info(`Running with tag "${tag}" and version "${version}"...`);
+
+  return [tag, version, !!ci];
+};
+
+const getShortCommitHash = () => {
+  return execSync("git rev-parse --short HEAD").toString().trim();
+};
+
+const askToCommit = (tag, ci, nextVersion) => {
+  if (tag !== "latest") {
+    return Promise.resolve();
+  }
+
+  return new Promise((resolve) => {
+    const rl = require("readline").createInterface({
+      input: process.stdin,
+      output: process.stdout,
+    });
+
+    rl.question("Do you want to commit these changes? (Y/n): ", (answer) => {
+      rl.close();
+
+      if (answer.toLowerCase() === "y") {
+        execSync(`git add -u`);
+        execSync(
+          `git commit -m "docs: release @excalidraw/excalidraw@${nextVersion}  🎉"`,
+        );
+      } else {
+        console.warn("Skipping commit. Don't forget to commit manually later!");
+      }
+
+      resolve();
+    });
+  });
+};
+
+const buildPackages = () => {
+  console.info("Running yarn install...");
+  execSync(`yarn --frozen-lockfile`);
+
+  console.info("Removing existing build artifacts...");
+  execSync(`yarn rm:build`);
+
+  console.info("Building packages...");
+  for (const packageName of PACKAGES) {
+    execSync(`yarn run build:esm`, {
+      cwd: path.resolve(`${PACKAGES_DIR}/${packageName}`),
+    });
+  }
+};
+
+const askToPublish = (tag, version) => {
+  return new Promise((resolve) => {
+    const rl = require("readline").createInterface({
+      input: process.stdin,
+      output: process.stdout,
+    });
+
+    rl.question("Do you want to publish these changes? (Y/n): ", (answer) => {
+      rl.close();
+
+      if (answer.toLowerCase() === "y") {
+        publishPackages(tag);
+      } else {
+        console.info("Skipping publish.");
+      }
+
+      resolve();
+    });
+  });
+};
+
+const publishPackages = (tag, version) => {
+  // for (const packageName of PACKAGES) {
+  //   execSync(`yarn --cwd ${PACKAGES_DIR}/${packageName} publish --tag ${tag}`);
+  //   console.info(
+  //     `Published "@excalidraw/${packageName}@${version}" with tag "${tag}" 🎉`,
+  //   );
+  // }
+};
+
+/** main */
+(async () => {
+  const [tag, version, ci] = getParams();
+
+  buildPackages();
+
+  if (tag === "latest") {
+    updateChangelog(version);
+  }
+
+  updatePackageJsons(version);
+
+  if (!ci) {
+    await askToCommit(tag, version);
+    await askToPublish(tag);
+  } else {
+    publishPackages(tag);
+  }
+})();