From 53e130960051123f1dc530c78b2e3c979d819dd1 Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 00:17:32 -0600 Subject: [PATCH 1/9] chore: centralize build config defs --- package.json | 1 + pnpm-lock.yaml | 3 +++ scripts/banner.js | 16 ------------- scripts/build.d.ts | 12 ++++++++++ scripts/build.js | 58 ++++++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 74 insertions(+), 16 deletions(-) delete mode 100644 scripts/banner.js create mode 100644 scripts/build.d.ts create mode 100644 scripts/build.js diff --git a/package.json b/package.json index 4c32ef4..6298add 100644 --- a/package.json +++ b/package.json @@ -34,6 +34,7 @@ "globals": "^16.0.0", "msw": "^2.7.3", "prettier": "^3.5.1", + "tsup": "^8.3.6", "typedoc": "^0.28.1", "typedoc-plugin-frontmatter": "^1.3.0", "typedoc-plugin-markdown": "^4.6.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0d26203..d26e7e7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -41,6 +41,9 @@ importers: prettier: specifier: ^3.5.1 version: 3.5.1 + tsup: + specifier: ^8.3.6 + version: 8.3.6(@microsoft/api-extractor@7.52.4(@types/node@22.13.14))(postcss@8.5.3)(tsx@4.19.3)(typescript@5.7.3)(yaml@2.7.1) typedoc: specifier: ^0.28.1 version: 0.28.1(typescript@5.7.3) diff --git a/scripts/banner.js b/scripts/banner.js deleted file mode 100644 index 797321b..0000000 --- a/scripts/banner.js +++ /dev/null @@ -1,16 +0,0 @@ -function createBanner(packageName, version) { - return `/** - * ${packageName} v${version} - * - * Copyright (c) Hunter Lovell - * - * This source code is licensed under the MIT license found in the - * LICENSE.md file in the root directory of this source tree. - * - * @license MIT - */`; -} - -module.exports = { - createBanner, -}; diff --git a/scripts/build.d.ts b/scripts/build.d.ts new file mode 100644 index 0000000..2b8b8b3 --- /dev/null +++ b/scripts/build.d.ts @@ -0,0 +1,12 @@ +import { type Options } from "tsup"; + +declare function createBanner(packageName: string, version: string): string; + +type BuildConfigParams = { + packageName: string; + packageVersion: string; + target: "browser" | "neutral"; + options: Options; +}; + +declare function getBuildConfig(params: BuildConfigParams): Options[]; diff --git a/scripts/build.js b/scripts/build.js new file mode 100644 index 0000000..8bce28d --- /dev/null +++ b/scripts/build.js @@ -0,0 +1,58 @@ +function createBanner(packageName, version) { + return `/** + * ${packageName} v${version} + * + * Copyright (c) Hunter Lovell + * + * This source code is licensed under the MIT license found in the + * LICENSE.md file in the root directory of this source tree. + * + * @license MIT + */`; +} + +export function getBuildConfig({ packageName, packageVersion, target, options }) { + const banner = createBanner(packageName, packageVersion); + if (target === "neutral") { + return [ + { + format: ["cjs", "esm"], + outDir: "dist", + dts: { resolve: true, banner }, + sourcemap: true, + platform: "neutral", + banner: { js: banner }, + ...options, + }, + ]; + } + if (target === "browser") { + const commonOptions = { + format: ["iife"], + outDir: "dist", + globalName: "eventkit", + sourcemap: true, + dts: false, + platform: "browser", + banner: { js: banner }, + }; + return [ + { + ...commonOptions, + minify: false, + ...options, + }, + { + ...commonOptions, + minify: true, + outExtension() { + return { + js: `.global.min.js`, + }; + }, + ...options, + }, + ]; + } + return []; +} From d80d5e6e52938b69df80d0b7a7c2bf58ec82da7d Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 00:17:47 -0600 Subject: [PATCH 2/9] chore(async-observable): use new build config pattern --- packages/async-observable/tsup.config.ts | 27 ++++++++++++++---------- 1 file changed, 16 insertions(+), 11 deletions(-) diff --git a/packages/async-observable/tsup.config.ts b/packages/async-observable/tsup.config.ts index 952ed77..f173b48 100644 --- a/packages/async-observable/tsup.config.ts +++ b/packages/async-observable/tsup.config.ts @@ -1,18 +1,23 @@ import { defineConfig } from "tsup"; -// @ts-expect-error - build tools are out of scope -import { createBanner } from "../../scripts/banner"; +import { getBuildConfig } from "../../scripts/build"; import pkg from "./package.json"; export default defineConfig([ - { - clean: true, - entry: ["lib/index.ts"], - format: ["cjs", "esm"], - outDir: "dist", - dts: true, - banner: { - js: createBanner(pkg.name, pkg.version), + ...getBuildConfig({ + packageName: pkg.name, + packageVersion: pkg.version, + target: "neutral", + options: { + entry: ["lib/index.ts"], }, - }, + }), + ...getBuildConfig({ + packageName: pkg.name, + packageVersion: pkg.version, + target: "browser", + options: { + entry: ["lib/index.ts"], + }, + }), ]); From 451569cf0dac6b243507bb7307096479059fe245 Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 00:17:58 -0600 Subject: [PATCH 3/9] chore(eventkit): use new build config pattern --- packages/eventkit/tsup.config.ts | 33 ++++++++++++++++++-------------- 1 file changed, 19 insertions(+), 14 deletions(-) diff --git a/packages/eventkit/tsup.config.ts b/packages/eventkit/tsup.config.ts index 2805545..a3300ba 100644 --- a/packages/eventkit/tsup.config.ts +++ b/packages/eventkit/tsup.config.ts @@ -1,20 +1,25 @@ import { defineConfig } from "tsup"; -// @ts-expect-error - build tools are out of scope -import { createBanner } from "../../scripts/banner"; +import { getBuildConfig } from "../../scripts/build"; import pkg from "./package.json"; -const banner = createBanner(pkg.name, pkg.version); - export default defineConfig([ - { - clean: true, - entry: ["lib/index.ts"], - format: ["cjs", "esm"], - outDir: "dist", - dts: { resolve: true, banner }, - noExternal: [/(.*)/], - splitting: false, - banner: { js: banner }, - }, + ...getBuildConfig({ + packageName: pkg.name, + packageVersion: pkg.version, + target: "neutral", + options: { + entry: ["lib/index.ts"], + noExternal: ["@eventkit/async-observable"], + }, + }), + ...getBuildConfig({ + packageName: pkg.name, + packageVersion: pkg.version, + target: "browser", + options: { + entry: ["lib/index.ts"], + noExternal: ["@eventkit/async-observable"], + }, + }), ]); From cb20d0cd355b7fe4720455c28cc7449b284c5d8c Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 00:21:01 -0600 Subject: [PATCH 4/9] fix: remove matching globalNames from build configs --- packages/async-observable/tsup.config.ts | 1 + packages/eventkit/tsup.config.ts | 1 + scripts/build.js | 1 - 3 files changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/async-observable/tsup.config.ts b/packages/async-observable/tsup.config.ts index f173b48..ff5506c 100644 --- a/packages/async-observable/tsup.config.ts +++ b/packages/async-observable/tsup.config.ts @@ -18,6 +18,7 @@ export default defineConfig([ target: "browser", options: { entry: ["lib/index.ts"], + globalName: "asyncObservable", }, }), ]); diff --git a/packages/eventkit/tsup.config.ts b/packages/eventkit/tsup.config.ts index a3300ba..6f2f8fa 100644 --- a/packages/eventkit/tsup.config.ts +++ b/packages/eventkit/tsup.config.ts @@ -19,6 +19,7 @@ export default defineConfig([ target: "browser", options: { entry: ["lib/index.ts"], + globalName: "eventkit", noExternal: ["@eventkit/async-observable"], }, }), diff --git a/scripts/build.js b/scripts/build.js index 8bce28d..1909cd2 100644 --- a/scripts/build.js +++ b/scripts/build.js @@ -30,7 +30,6 @@ export function getBuildConfig({ packageName, packageVersion, target, options }) const commonOptions = { format: ["iife"], outDir: "dist", - globalName: "eventkit", sourcemap: true, dts: false, platform: "browser", From 91e45bd4eb6ef10bae9ff36476fcca114fcc136a Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 00:21:32 -0600 Subject: [PATCH 5/9] chore(eventkit-http): use new build configs --- packages/eventkit-http/tsup.config.ts | 27 ++++++++++++++++----------- 1 file changed, 16 insertions(+), 11 deletions(-) diff --git a/packages/eventkit-http/tsup.config.ts b/packages/eventkit-http/tsup.config.ts index 952ed77..f173b48 100644 --- a/packages/eventkit-http/tsup.config.ts +++ b/packages/eventkit-http/tsup.config.ts @@ -1,18 +1,23 @@ import { defineConfig } from "tsup"; -// @ts-expect-error - build tools are out of scope -import { createBanner } from "../../scripts/banner"; +import { getBuildConfig } from "../../scripts/build"; import pkg from "./package.json"; export default defineConfig([ - { - clean: true, - entry: ["lib/index.ts"], - format: ["cjs", "esm"], - outDir: "dist", - dts: true, - banner: { - js: createBanner(pkg.name, pkg.version), + ...getBuildConfig({ + packageName: pkg.name, + packageVersion: pkg.version, + target: "neutral", + options: { + entry: ["lib/index.ts"], }, - }, + }), + ...getBuildConfig({ + packageName: pkg.name, + packageVersion: pkg.version, + target: "browser", + options: { + entry: ["lib/index.ts"], + }, + }), ]); From a1763852f06aac09f260ed1b0a6472c9843fc636 Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 12:31:28 -0600 Subject: [PATCH 6/9] feat(docs): add cdn instructions --- docs/guide/getting-started.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/docs/guide/getting-started.md b/docs/guide/getting-started.md index 0b2424a..81481cf 100644 --- a/docs/guide/getting-started.md +++ b/docs/guide/getting-started.md @@ -24,6 +24,24 @@ bun add @eventkit/base ::: +### Using a CDN + +Eventkit also bundles a browser-friendly version of each package that can be accessed using a CDN like [unpkg](https://unpkg.com/). + +```html + + + + +``` + +When imported this way, all exports are available on the `eventkit` global variable. + +```js +const { map, filter, Stream } = eventkit; +const stream = new Stream(); +``` + ## A Simple Example Let's create a simple example to demonstrate how eventkit works. We'll create a stream of events and filter them based on a condition. From 82fa698389184ebae20bc0be428261e74c32ccf4 Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 12:32:10 -0600 Subject: [PATCH 7/9] fix: use less ambiguous global names for browser bundle --- packages/async-observable/tsup.config.ts | 2 +- packages/eventkit-http/tsup.config.ts | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/async-observable/tsup.config.ts b/packages/async-observable/tsup.config.ts index ff5506c..87f207a 100644 --- a/packages/async-observable/tsup.config.ts +++ b/packages/async-observable/tsup.config.ts @@ -18,7 +18,7 @@ export default defineConfig([ target: "browser", options: { entry: ["lib/index.ts"], - globalName: "asyncObservable", + globalName: "eventkit.asyncObservable", }, }), ]); diff --git a/packages/eventkit-http/tsup.config.ts b/packages/eventkit-http/tsup.config.ts index f173b48..5952496 100644 --- a/packages/eventkit-http/tsup.config.ts +++ b/packages/eventkit-http/tsup.config.ts @@ -18,6 +18,7 @@ export default defineConfig([ target: "browser", options: { entry: ["lib/index.ts"], + globalName: "eventkit.http", }, }), ]); From 19e7568c51042b3cd9a72d6bdd7cb5f41eb50265 Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 12:32:26 -0600 Subject: [PATCH 8/9] chore: add cdn instructions to package readmes --- packages/async-observable/README.md | 17 +++++++++++++++++ packages/eventkit-http/README.md | 17 +++++++++++++++++ packages/eventkit/README.md | 17 +++++++++++++++++ 3 files changed, 51 insertions(+) diff --git a/packages/async-observable/README.md b/packages/async-observable/README.md index 2f667fd..7961836 100644 --- a/packages/async-observable/README.md +++ b/packages/async-observable/README.md @@ -6,6 +6,23 @@ npm i @eventkit/async-observable ``` +### Using a CDN + +This package also bundles a browser-friendly version that can be accessed using a CDN like [unpkg](https://unpkg.com/). + +```html + + + + +``` + +When imported this way, all exports are available on the `eventkit.asyncObservable` global variable. + +```js +const { AsyncObservable } = eventkit.asyncObservable; +``` + ## Related Resources - [Observable Pattern](https://hntrl.github.io/eventkit/guide/concepts/observable-pattern) diff --git a/packages/eventkit-http/README.md b/packages/eventkit-http/README.md index 1185587..3bb258b 100644 --- a/packages/eventkit-http/README.md +++ b/packages/eventkit-http/README.md @@ -6,6 +6,23 @@ npm i @eventkit/http ``` +### Using a CDN + +This package also bundles a browser-friendly version that can be accessed using a CDN like [unpkg](https://unpkg.com/). + +```html + + + + +``` + +When imported this way, all exports are available on the `eventkit.http` global variable. + +```js +const { EventSource } = eventkit.http; +``` + ## Related Resources - [HTTP Streaming](https://hntrl.github.io/eventkit/guide/examples/http-streaming) diff --git a/packages/eventkit/README.md b/packages/eventkit/README.md index 4137fe8..742d8e7 100644 --- a/packages/eventkit/README.md +++ b/packages/eventkit/README.md @@ -6,6 +6,23 @@ npm i @eventkit/base ``` +### Using a CDN + +This package also bundles a browser-friendly version that can be accessed using a CDN like [unpkg](https://unpkg.com/). + +```html + + + + +``` + +When imported this way, all exports are available on the `eventkit` global variable. + +```js +const { Stream, filter } = eventkit; +``` + ## Basic Example This is a basic example of how to use an eventkit stream. To get started, you should check out the [Getting Started](https://hntrl.github.io/eventkit/guide/getting-started) guide. From d1d5dcace45730de1feabfbc81216a7fd034b29f Mon Sep 17 00:00:00 2001 From: hntrl Date: Tue, 22 Apr 2025 12:38:23 -0600 Subject: [PATCH 9/9] chore: add bundle changeset --- .changeset/twelve-apples-cry.md | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 .changeset/twelve-apples-cry.md diff --git a/.changeset/twelve-apples-cry.md b/.changeset/twelve-apples-cry.md new file mode 100644 index 0000000..e162240 --- /dev/null +++ b/.changeset/twelve-apples-cry.md @@ -0,0 +1,7 @@ +--- +"@eventkit/async-observable": patch +"@eventkit/http": patch +"@eventkit/base": patch +--- + +Gave some TLC to the bundling process for each package. Each package bundle now contains sourcemaps for both cjs & esm builds, as well as a new `index.global.js` and `index.global.min.js` that is intended to be used with browser targets.