Refine Parcel builds

.github/workflows/ci.yml

@@ -23,6 +23,7 @@ jobs:
           yarn workspace ani-cursor build
           yarn workspace webamp build
           yarn workspace webamp build-library
+          yarn workspace webamp move-library
       - name: Lint
         run: |
           yarn lint

packages/webamp/js/webampLazyBrowser.js

@@ -0,0 +1,3 @@
+import Webamp from "./webampLazy";
+
+window.Webamp = Webamp;

packages/webamp/package.json

@@ -11,21 +11,32 @@
     "index.d.ts"
   ],
   "browser": "dist/webamp-browser/webampBrowser.js",
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead",
+    "not ie <= 11",
+    "not op_mini all"
+  ],
   "targets": {
-    "webamp": {
-      "source": "js/webamp.js",
-      "outputFormat": "esmodule",
-      "isLibrary": true,
-      "optimize": true
-    },
     "webamp-browser": {
       "source": "js/webampBrowser.js",
-      "outputFormat": "global"
+      "outputFormat": "global",
+      "optimize": false
     },
-    "webamp-lazy": {
-      "source": "js/webampLazy.tsx",
-      "outputFormat": "esmodule",
-      "isLibrary": true,
+    "webamp-browser-min": {
+      "source": "js/webampBrowser.js",
+      "outputFormat": "global",
+      "optimize": true
+    },
+    "webamp-lazy-browser": {
+      "source": "js/webampLazyBrowser.js",
+      "outputFormat": "global",
+      "optimize": false
+    },
+    "webamp-lazy-browser-min": {
+      "source": "js/webampLazyBrowser.js",
+      "outputFormat": "global",
       "optimize": true
     },
     "demo-site": {
@@ -37,8 +48,8 @@
     "lint": "eslint . --ext ts,tsx,js",
     "type-check": "tsc",
     "build": "parcel build --target demo-site",
-    "build-library": "parcel build --target webamp --target webamp-lazy --target webamp-browser --reporter @parcel/reporter-bundle-analyzer",
-    "move-library": "mkdir built; cp dist/webamp-browser/webampBrowser.js built/webamp.bundle.min.js && cp dist/webamp-lazy/webampLazy.js built/webamp.lazy-bundle.min.js",
+    "build-library": "parcel build --target webamp-browser --target webamp-browser-min --target webamp-lazy-browser --target webamp-lazy-browser-min --reporter @parcel/reporter-bundle-analyzer",
+    "move-library": "node scripts/moveLibrary.js",
     "prepublishOnly": "npm run build-library && npm run move-library",
     "serve": "http-server ./dist/demo-site",
     "start": "parcel demo/index.html",

packages/webamp/scripts/moveLibrary.js

@@ -0,0 +1,41 @@
+// mkdir built; cp dist/webamp-browser-min/webampBrowser.js built/webamp.bundle.min.js && cp dist/webamp-lazy-browser-min/webampLazyBrowser.js built/webamp.lazy-bundle.min.js
+
+// Script to replicate the location of build artifacts that existed in the old Webpack build.
+const fs = require("fs");
+const path = require("path");
+
+const BUILD_DIR = "../built";
+const DIST_DIR = "../dist";
+
+const TARGETS = [
+  {
+    parcelPath: "webamp-browser/webampBrowser.js",
+    webpackName: "webamp.bundle.js",
+  },
+  {
+    parcelPath: "webamp-browser-min/webampBrowser.js",
+    webpackName: "webamp.bundle.min.js",
+  },
+  {
+    parcelPath: "webamp-lazy-browser/webampLazyBrowser.js",
+    webpackName: "webamp.lazy-bundle.js",
+  },
+  {
+    parcelPath: "webamp-lazy-browser-min/webampLazyBrowser.js",
+    webpackName: "webamp.lazy-bundle.min.js",
+  },
+];
+
+fs.mkdirSync(BUILD_DIR, { recursive: true });
+
+console.log("Copying build artifacts to their old Webpack locations:");
+for (const target of TARGETS) {
+  const from = path.join(DIST_DIR, target.parcelPath);
+  const to = path.join(BUILD_DIR, target.webpackName);
+  fs.copyFileSync(path.join(__dirname, from), path.join(__dirname, to));
+  console.log(`Copied "${from}" to "${to}".`);
+  const fromMap = `${from}.map`;
+  const toMap = `${to}.map`;
+  console.log(`Copied "${fromMap}" to "${toMap}".`);
+  fs.copyFileSync(path.join(__dirname, fromMap), path.join(__dirname, toMap));
+}