Switch to Preconstruct to enable dev bundles

bvaughn · May 15, 2023 · b02c307 · b02c307
1 parent 5aafa03
commit b02c307
Show file tree

Hide file tree

Showing 9 changed files with 1,776 additions and 848 deletions.
diff --git a/babel.config.js b/babel.config.js
@@ -0,0 +1,3 @@
+module.exports = {
+  presets: [require.resolve("@babel/preset-typescript")],
+};
diff --git a/package.json b/package.json
@@ -1,4 +1,5 @@
 {
+  "name": "react-resizable-panels-repo",
   "private": true,
   "workspaces": [
     "packages/*"
@@ -10,13 +11,14 @@
     "clear:node_modules": "rm -rf ./node_modules && rm -rf ./packages/*/node_modules",
     "docs": "cd packages/react-resizable-panels-website && pnpm build",
     "lint": "cd packages/react-resizable-panels && pnpm lint",
-    "prerelease": "rm -rf ./.parcel-cache && cd packages/react-resizable-panels && rm -rf ./dist && pnpm build",
+    "prerelease": "preconstruct build",
     "prettier": "prettier --write \"**/*.{css,html,js,json,jsx,ts,tsx}\"",
     "prettier:ci": "prettier --check \"**/*.{css,html,js,json,jsx,ts,tsx}\"",
     "typescript": "tsc --noEmit",
     "typescript:watch": "tsc --noEmit --watch"
   },
   "devDependencies": {
+    "@babel/preset-typescript": "^7.21.5",
     "@types/node": "^18.15.11",
     "@types/react": "^18.0.26",
     "@types/react-dom": "^18.0.10",
@@ -32,6 +34,21 @@
   "dependencies": {
     "@parcel/core": "^2.8.3",
     "@parcel/packager-ts": "^2.8.3",
-    "@parcel/transformer-typescript-types": "^2.8.3"
+    "@parcel/transformer-typescript-types": "^2.8.3",
+    "@preconstruct/cli": "^2.6.4"
+  },
+  "preconstruct": {
+    "packages": [
+      "packages/!(react-resizable-panels-website)"
+    ],
+    "globals": {
+      "react": "React"
+    },
+    "exports": {
+      "importConditionDefaultExport": "default"
+    },
+    "___experimentalFlags_WILL_CHANGE_IN_PATCH": {
+      "importsConditions": true
+    }
   }
 }
diff --git a/packages/react-resizable-panels-website/src/routes/examples/ImperativePanelGroupApi.tsx b/packages/react-resizable-panels-website/src/routes/examples/ImperativePanelGroupApi.tsx
@@ -11,7 +11,7 @@ import Example from "./Example";
 import styles from "./ImperativePanelGroupApi.module.css";
 import sharedStyles from "./shared.module.css";
 import Code from "../../components/Code";
-import { ImperativePanelGroupHandle } from "react-resizable-panels/src/PanelGroup";
+import { ImperativePanelGroupHandle } from "react-resizable-panels";
 
 type Sizes = {
   left: number;

diff --git a/packages/react-resizable-panels-website/tests/utils/assert.ts b/packages/react-resizable-panels-website/tests/utils/assert.ts
@@ -1,5 +1,5 @@
 import { ImperativePanelGroupHandle } from "react-resizable-panels";
-import { ImperativePanelHandle } from "react-resizable-panels/src";
+import { ImperativePanelHandle } from "react-resizable-panels";
 
 export function assert(
   expectedCondition: boolean,

diff --git a/packages/react-resizable-panels/package.json b/packages/react-resizable-panels/package.json
@@ -9,11 +9,33 @@
     "url": "git+https://github.com/bvaughn/react-resizable-panels.git"
   },
   "source": "src/index.ts",
-  "main": "dist/react-resizable-panels.js",
-  "module": "dist/react-resizable-panels.module.js",
-  "types": "dist/react-resizable-panels.d.ts",
+  "main": "dist/react-resizable-panels.cjs.js",
+  "module": "dist/react-resizable-panels.esm.js",
+  "exports": {
+    ".": {
+      "types": {
+        "import": "./dist/react-resizable-panels.cjs.mjs",
+        "default": "./dist/react-resizable-panels.cjs.js"
+      },
+      "development": {
+        "module": "./dist/react-resizable-panels.development.esm.js",
+        "import": "./dist/react-resizable-panels.development.cjs.mjs",
+        "default": "./dist/react-resizable-panels.development.cjs.js"
+      },
+      "module": "./dist/react-resizable-panels.esm.js",
+      "import": "./dist/react-resizable-panels.cjs.mjs",
+      "default": "./dist/react-resizable-panels.cjs.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "imports": {
+    "#is-development": {
+      "development": "./src/env-conditions/development.ts",
+      "default": "./src/env-conditions/production.ts"
+    }
+  },
+  "types": "dist/react-resizable-panels.cjs.d.ts",
   "scripts": {
-    "build": "parcel build",
     "lint": "eslint \"src/**/*.{ts,tsx}\"",
     "watch": "parcel watch --port=2345"
   },

diff --git a/packages/react-resizable-panels/src/env-conditions/development.ts b/packages/react-resizable-panels/src/env-conditions/development.ts
@@ -0,0 +1 @@
+export const isDevelopment = true;
diff --git a/packages/react-resizable-panels/src/env-conditions/production.ts b/packages/react-resizable-panels/src/env-conditions/production.ts
@@ -0,0 +1 @@
+export const isDevelopment = false;