From d69ded1c1def3d3829c935026abcfeeb9e37b722 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 30 Mar 2026 14:23:09 -0700 Subject: [PATCH 1/3] Publish themes as ESM wrapper modules for npm consumers Instead of requiring raw JSON imports (which break in Node ESM without import attributes), the build now generates dist/*.mjs wrappers that inline each theme as `export default Object.freeze(JSON.parse(...))`, following the same pattern as @shikijs/themes. --- .gitignore | 1 + .vscodeignore | 1 + README.md | 28 ++++++++++++++++++++++++++-- package.json | 12 +++++++++++- src/build.ts | 21 +++++++++++++++++++++ 5 files changed, 60 insertions(+), 3 deletions(-) diff --git a/.gitignore b/.gitignore index 1f4c369..4381363 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ .DS_Store node_modules/ build +dist *.vsix diff --git a/.vscodeignore b/.vscodeignore index 9881ece..6ea61a9 100644 --- a/.vscodeignore +++ b/.vscodeignore @@ -7,3 +7,4 @@ /package-lock.json /src/ /build/ +/dist/ diff --git a/README.md b/README.md index c67a275..166e338 100644 --- a/README.md +++ b/README.md @@ -11,6 +11,30 @@ OPEN POSITIONS: [Systems Engineer](https://pierre.computer/careers/systems-engin ~~~ -Overview: - - Light and dark themes for Visual Studio Code, Cursor, Zed, and Shiki. +Overview: + - Light and dark themes for Visual Studio Code, Cursor, Zed, and Shiki. - Built for [Diffs.com](https://diffs.com) + +~~~ + +Usage: + + VS Code / Cursor: + 1. Install "Pierre Theme" from the Extensions marketplace + 2. Cmd+Shift+P > "Color Theme" > select Pierre Light or Pierre Dark + + Shiki / npm: + npm install @pierre/theme + + import pierreDark from '@pierre/theme/pierre-dark' + import pierreLight from '@pierre/theme/pierre-light' + + Available themes: + - @pierre/theme/pierre-dark + - @pierre/theme/pierre-light + - @pierre/theme/pierre-dark-vibrant (Display P3) + - @pierre/theme/pierre-light-vibrant (Display P3) + + Zed: + Install "Pierre" from the Zed extension registry +``` diff --git a/package.json b/package.json index 276f784..5e0da73 100644 --- a/package.json +++ b/package.json @@ -47,7 +47,8 @@ "build": "ts-node src/build.ts", "test": "npm run build && ts-node src/test.ts", "start": "nodemon --watch src --ext ts --exec npm run build", - "package": "ts-node src/package-vsix.ts" + "package": "ts-node src/package-vsix.ts", + "prepublishOnly": "npm run build" }, "devDependencies": { "@vscode/vsce": "^3.2.2", @@ -55,6 +56,15 @@ "ts-node": "^10.9.2", "typescript": "^5.9.3" }, + "sideEffects": false, + "exports": { + ".": "./dist/index.mjs", + "./pierre-dark": "./dist/pierre-dark.mjs", + "./pierre-light": "./dist/pierre-light.mjs", + "./pierre-dark-vibrant": "./dist/pierre-dark-vibrant.mjs", + "./pierre-light-vibrant": "./dist/pierre-light-vibrant.mjs", + "./themes/*": "./themes/*" + }, "publishConfig": { "access": "public" } diff --git a/src/build.ts b/src/build.ts index e1ffad8..218f66a 100644 --- a/src/build.ts +++ b/src/build.ts @@ -37,3 +37,24 @@ const zedTheme = makeZedThemeFamily("Pierre", "pierrecomputer", [ writeFileSync("zed/themes/pierre.json", JSON.stringify(zedTheme, null, 2), "utf8"); console.log("Wrote zed/themes/pierre.json"); + +// ============================================ +// ESM wrapper modules (for npm / Shiki consumers) +// ============================================ +mkdirSync("dist", { recursive: true }); + +const themeNames: string[] = []; + +for (const { file, theme } of vscodeThemes) { + const name = file.replace("themes/", "").replace(".json", ""); + themeNames.push(name); + const json = JSON.stringify(theme); + const escaped = json.replace(/\\/g, "\\\\").replace(/'/g, "\\'"); + const mjs = `export default Object.freeze(JSON.parse('${escaped}'))\n`; + writeFileSync(`dist/${name}.mjs`, mjs, "utf8"); + console.log("Wrote", `dist/${name}.mjs`); +} + +const indexMjs = `export const themeNames = ${JSON.stringify(themeNames)}\n`; +writeFileSync("dist/index.mjs", indexMjs, "utf8"); +console.log("Wrote dist/index.mjs"); From 9094062a3f3f8a9eb87b70b3b5ff47e6665c9101 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 30 Mar 2026 14:25:28 -0700 Subject: [PATCH 2/3] Bump version --- package-lock.json | 4 ++-- package.json | 2 +- zed/extension.toml | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package-lock.json b/package-lock.json index ebf1085..d436b8b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@pierre/theme", - "version": "0.0.24", + "version": "0.0.25", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@pierre/theme", - "version": "0.0.24", + "version": "0.0.25", "license": "MIT", "devDependencies": { "@vscode/vsce": "^3.2.2", diff --git a/package.json b/package.json index 5e0da73..f537679 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "@pierre/theme", "displayName": "Pierre Theme", "description": "Pierre theme for Shiki, VS Code, and more", - "version": "0.0.24", + "version": "0.0.25", "publisher": "pierrecomputer", "icon": "icon.png", "galleryBanner": { diff --git a/zed/extension.toml b/zed/extension.toml index f7628cc..cbe59cb 100644 --- a/zed/extension.toml +++ b/zed/extension.toml @@ -1,7 +1,7 @@ id = "pierre-theme" name = "Pierre" description = "A warm, orange-accented color theme with light and dark variants" -version = "0.0.24" +version = "0.0.25" schema_version = 1 authors = ["pierrecomputer"] repository = "https://github.com/pierrecomputer/pierre-theme" From e14db864013b1249fcd8ac57229e3936e8e2ee9b Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Mon, 30 Mar 2026 14:30:44 -0700 Subject: [PATCH 3/3] Add build step to npm publish job and verify dist in CI The npm publish job was missing install + build steps, so dist/ would not exist when publishing. Also adds a verification step to the test workflow to confirm all ESM wrapper modules are generated. --- .github/workflows/publish.yml | 6 ++++++ .github/workflows/test.yml | 14 ++++++++++++++ 2 files changed, 20 insertions(+) diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml index 3704502..ac89c30 100644 --- a/.github/workflows/publish.yml +++ b/.github/workflows/publish.yml @@ -56,6 +56,12 @@ jobs: cache: 'npm' registry-url: 'https://registry.npmjs.org' + - name: Install dependencies + run: npm ci + + - name: Build theme + run: npm run build + - name: Publish to npm env: NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index fc8e4cd..368e2f3 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -44,6 +44,20 @@ jobs: fi echo "✅ All theme files generated successfully" + - name: Verify ESM wrapper modules exist + run: | + for theme in pierre-dark pierre-light pierre-dark-vibrant pierre-light-vibrant; do + if [ ! -f "dist/${theme}.mjs" ]; then + echo "❌ dist/${theme}.mjs not generated" + exit 1 + fi + done + if [ ! -f "dist/index.mjs" ]; then + echo "❌ dist/index.mjs not generated" + exit 1 + fi + echo "✅ All ESM wrapper modules generated successfully" + - name: Check file sizes run: | light_size=$(wc -c < themes/pierre-light.json)