Skip to content

Fix font loading dependencies - #289

Open
zoharma wants to merge 3 commits into
mainfrom
zma/ds-dependency-update
Open

Fix font loading dependencies#289
zoharma wants to merge 3 commits into
mainfrom
zma/ds-dependency-update

Conversation

@zoharma

@zoharma zoharma commented Sep 7, 2026

Copy link
Copy Markdown
Contributor

Fonts are now bundled directly into dist instead of being left for consuming apps to load.

This fixes the following:

  • issue where the injected font files used incorrect URLs and could not be resolved, they are now included in the package, and would need to be called specifically to a CSS file.
  • SSR related issue where apps like Next.js or React Router could crash with ERR_UNKNOWN_FILE_EXTENSION when Node tried to load the font CSS directly
  • It removes includeDependencies: true from the Rollup config, so font packages are included in the build instead of treated as external dependencies.
  • Due to this, @mui/icons-material and react-icons are still kept external, so they are now listed as peerDependencies.
  • Included only Latin type for IBM Plex Mono to reduce package size.

Verified on the new dev app branch.

Notes:

  • Apps that use components with icons will need to install them explicitly: pnpm add @mui/icons-material react-icons
  • Apps need to import the font stylesheet once: import "@diamondlightsource/sci-react-ui/font-styles.css"

@zoharma zoharma closed this Sep 7, 2026
@zoharma zoharma reopened this Sep 7, 2026
@zoharma zoharma changed the title Fix SSR font loading and icon dependencies Fix font loading and icon dependencies Sep 8, 2026
@zoharma zoharma changed the title Fix font loading and icon dependencies Fix font loading dependencies Sep 8, 2026
* Move `@mui/icons-material` and `react-icons` to `peerDependencies`, while keeping them in `devDependencies` so local builds and Storybook still work.
* Remove `includeDependencies: true` from `rollup-plugin-peer-deps-external` so regular dependencies, including `@fontsource-*`, are bundled into `dist`.
- Extract fonts to a real dist/style.css instead of injecting via JS
- Add a "./style.css" export for consumers to import
- update to `pnpm-lock.yaml` single-quote based on new pnpm 11 conventions
also calling latin font directly for mono
@zoharma
zoharma force-pushed the zma/ds-dependency-update branch from 9c08e5d to bf6d9c2 Compare September 9, 2026 15:46
@zoharma
zoharma marked this pull request as ready for review September 9, 2026 16:14
@zoharma
zoharma requested a review from a team September 9, 2026 16:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant