Skip to content

Transpile Starlight packages#3572

Draft
HiDeoo wants to merge 40 commits intowithastro:mainfrom
HiDeoo:hd/feat-ts-to-js
Draft

Transpile Starlight packages#3572
HiDeoo wants to merge 40 commits intowithastro:mainfrom
HiDeoo:hd/feat-ts-to-js

Conversation

@HiDeoo
Copy link
Copy Markdown
Member

@HiDeoo HiDeoo commented Nov 26, 2025

Description

This PR is an early draft (not yet ready for review) that transpiles Starlight packages from TypeScript to JavaScript to avoid publishing TypeScript which is not a recommended or even supported practice.

Approach

Multiples approaches are usually available when it comes to transpiling in monorepos and keeping the flexibility of working with TypeScript source code in development.

Custom export condition was one of the first options considered, and would probably be the most long-term solution, but we cannot currently use them for Starlight. For the docs/ site to properly consume custom conditions in development, in Astro, such conditions would need to be defined in the Astro configuration using the vite property, altho Starlight itself is imported in such configuration so it's a chicken-and-egg problem right now. There is a world in the future where we would be able to run Astro using node --conditions directly, and Vite automatically picks up those conditions, but this requires some changes in Node that are not yet available.

Considering the above, this PR relies on pnpm and specifically on the fact that pnpm automatically overrides some fields in package.json files when packages are published with pnpm publish by the one defined in the package.json publishConfig property. In the case of Starlight, we maintain 2 exports fields: one for development (pointing to the TypeScript source files like it is today) and one for production (pointing to the transpiled JavaScript files).

How to test

When getting closer to a reviewable state, some pre-release packages will probably be published to test the changes in a real-world scenario.

In the meantime, you can test the changes locally using a different Starlight project outside of the monorepo, e.g. one setup using pnpm create astro --template starlight.

# Move to the Starlight package
$ cd packages/starlight
# Build the package
$ pnpm build
# Pack the package to a temporary location like it would be published
$ pnpm pack --pack-destination ~

# Move to your test Starlight project
$ cd ~/path/to/your/test/starlight/project/that/is/outside/of/the/monorepo
# Remove existing Starlight package
$ pnpm remove @astrojs/starlight && pnpm add ~/astrojs-starlight-0.36.2.tgz

Remaining tasks

  • Transpile Starlight packages
    • Starlight
    • DocSearch plugin
    • Markdoc preset (probably nothing to do but need to verify)
    • Tailwind CSS (probably nothing to do but need to double check)
  • Male sure our release workflow, specifically pnpm changeset publish uses pnpm publish under the hood (it probably does, as package-manager-detector is used when actually publishing to figure out the package manager but need to double check)
  • Changesets

@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Nov 26, 2025

🦋 Changeset detected

Latest commit: ece2dcc

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@astrojs/starlight Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@netlify
Copy link
Copy Markdown

netlify bot commented Nov 26, 2025

Deploy Preview for astro-starlight ready!

Name Link
🔨 Latest commit ece2dcc
🔍 Latest deploy log https://app.netlify.com/projects/astro-starlight/deploys/69cd7455913b5b000968f832
😎 Deploy Preview https://deploy-preview-3572--astro-starlight.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 99 (🔴 down 1 from production)
Accessibility: 100 (no change from production)
Best Practices: 100 (no change from production)
SEO: 100 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

@github-actions github-actions bot added 🚨 action Changes to GitHub Action workflows 📚 docs Documentation website changes 🌟 core Changes to Starlight’s main package labels Nov 26, 2025
@astrobot-houston
Copy link
Copy Markdown
Contributor

astrobot-houston commented Nov 26, 2025

Lunaria Status Overview

🌕 This pull request will trigger status changes.

Learn more

By default, every PR changing files present in the Lunaria configuration's files property will be considered and trigger status changes accordingly.

You can change this by adding one of the keywords present in the ignoreKeywords property in your Lunaria configuration file in the PR's title (ignoring all files) or by including a tracker directive in the merged commit's description.

Tracked Files

Locale File Note
en components/asides.mdx Source changed, localizations will be marked as outdated.
en components/badges.mdx Source changed, localizations will be marked as outdated.
en components/card-grids.mdx Source changed, localizations will be marked as outdated.
en components/cards.mdx Source changed, localizations will be marked as outdated.
en components/file-tree.mdx Source changed, localizations will be marked as outdated.
en components/icons.mdx Source changed, localizations will be marked as outdated.
en components/link-buttons.mdx Source changed, localizations will be marked as outdated.
en components/link-cards.mdx Source changed, localizations will be marked as outdated.
en components/steps.mdx Source changed, localizations will be marked as outdated.
en components/tabs.mdx Source changed, localizations will be marked as outdated.
en guides/css-and-tailwind.mdx Source changed, localizations will be marked as outdated.
en reference/overrides.md Source changed, localizations will be marked as outdated.
Warnings reference
Icon Description
🔄️ The source for this localization has been updated since the creation of this pull request, make sure all changes in the source have been applied.

@HiDeoo HiDeoo mentioned this pull request Dec 3, 2025
@HiDeoo
Copy link
Copy Markdown
Member Author

HiDeoo commented Dec 18, 2025

Small note (mostly for me to not forget) that tsdown 0.17.3 released last week added glob support to the copy option, which means we can probably use it instead of our own globCopyPlugin() currently included in this PR that I initially created due to the lack of glob support for this option.

'The writing direction of this language; `"ltr"` for left-to-right (the default) or `"rtl"` for right-to-left.'
),
});
}
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Only adding a note for later as I'm not on my computer right now and to not forget, but it just hit me that these describe() have probably been removed when updating to Zod 4 and re-introduced when updating the PR.

@@ -1,4 +1,4 @@
import { FileIcons } from '../user-components/file-tree-icons';
import { FileIcons, type FileIcon } from '../user-components/file-tree-icons';

export const BuiltInIcons = {
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Note/thought: is it safe for us to do this?

Suggested change
export const BuiltInIcons = {
export const BuiltInIcons: Record<BuiltInIcon, string> = {

The current test that checks the types align did not provide very readable output while I was resolving the merge — it’s almost impossible to tell from it which keys are missing:

packages/starlight/__tests__/basics/icon.test-d.ts:6:58 - error ts(2344): Type 'BuiltInIcon' does not satisfy the constraint '"Expected: literal string: download, Actual: literal string: firefox" | "Expected: literal string: download, Actual: literal string: chrome" | "Expected: literal string: download, Actual: literal string: edge" | ... 420 more ... | "Expected: literal string: substack, Actual: literal string: safari"'.
  Type '"error"' is not assignable to type '"Expected: literal string: download, Actual: literal string: firefox" | "Expected: literal string: download, Actual: literal string: chrome" | "Expected: literal string: download, Actual: literal string: edge" | ... 420 more ... | "Expected: literal string: substack, Actual: literal string: safari"'.

6  expectTypeOf<keyof typeof BuiltInIcons>().toEqualTypeOf<BuiltInIcon>();
                                                           ~~~~~~~~~~~

Whereas with an explicit Record it’s easy to identify missing keys.

I would need to test if this causes issues with inlining the union type as noted later in this file.

@delucis delucis added the 🌟 minor Change that triggers a minor release label Apr 7, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🚨 action Changes to GitHub Action workflows 🌟 core Changes to Starlight’s main package 📚 docs Documentation website changes 🌟 minor Change that triggers a minor release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Publish Modern Javascript instead of Typescript

3 participants