Skip to content

feat(website): preserve nextra style with rspress-custom-theme skill #322

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
kdy1 merged 3 commits into from
Jul 10, 2026
Merged

feat(website): preserve nextra style with rspress-custom-theme skill #322

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
22bfb4c
feat: polish the Rspress site experience
SoonIter Jul 10, 2026
c023145
feat(website): additional theme polish and enable llms
SoonIter Jul 10, 2026
03ca754
feat(website): customize the Rspress theme and home page
SoonIter Jul 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions apps/website/docs/_nav.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,10 @@
"text": "Playground",
"link": "/playground/",
"activeMatch": "^/playground/"
},
{
"text": "Blog",
"link": "/blog/perf-swc-vs-babel",
"activeMatch": "^/blog/"
}
]
20 changes: 2 additions & 18 deletions apps/website/docs/docs/getting-started.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Tab, Tabs } from '@rspress/core/theme';
import { PackageManagerTabs } from '@rspress/core/theme';

# Getting Started

Expand All @@ -8,23 +8,7 @@ The easiest way to try SWC is using the [Playground](/playground/).

Otherwise, run the following to download pre-built binaries:

<Tabs>
<Tab label="pnpm">
```bash
pnpm add -D @swc/cli @swc/core
```
</Tab>
<Tab label="npm">
```bash
npm i -D @swc/cli @swc/core
```
</Tab>
<Tab label="yarn">
```bash
yarn add -D @swc/cli @swc/core
```
</Tab>
</Tabs>
<PackageManagerTabs command="install -D @swc/cli @swc/core" />

@chatgpt-codex-connector chatgpt-codex-connector Bot Jul 10, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

P2 Badge Avoid generating a Deno install tab for the CLI

When command is a string, PackageManagerTabs renders the default npm/yarn/pnpm/bun/deno tabs. On this install block that adds a Deno command for @swc/cli, but the workflow immediately tells users to run the Node executable with npx swc; deno add does not provide that CLI path, so Deno users get a dead-end install option that was not present in the previous pnpm/npm/yarn-only tabs. Use an explicit command object, as the homepage already does, or otherwise omit unsupported managers.

Useful? React with 👍 / 👎.


Then, you can transpile your first file and emit to `stdout`:

Expand Down
6 changes: 3 additions & 3 deletions apps/website/docs/docs/references/wasm-typescript.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import { PackageManagerTabs } from '@rspress/core/theme';

# @swc/wasm-typescript

## Installation

```bash
npm install @swc/wasm-typescript
```
<PackageManagerTabs command="install @swc/wasm-typescript" />

### Usage

Expand Down
20 changes: 2 additions & 18 deletions apps/website/docs/docs/usage/bundling.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Tab, Tabs } from '@rspress/core/theme';
import { PackageManagerTabs } from '@rspress/core/theme';
import Callout from '@components/Callout';

# Bundling (swcpack)
Expand All @@ -18,23 +18,7 @@ View a [basic example of bundling](https://github.com/swc-project/pkgs/tree/main

## Usage

<Tabs>
<Tab label="pnpm">
```bash
pnpm add -D @swc/cli @swc/core
```
</Tab>
<Tab label="npm">
```bash
npm i -D @swc/cli @swc/core
```
</Tab>
<Tab label="yarn">
```bash
yarn add -D @swc/cli @swc/core
```
</Tab>
</Tabs>
<PackageManagerTabs command="install -D @swc/cli @swc/core" />

Create a `spack.config.js` file and run:

Expand Down
24 changes: 3 additions & 21 deletions apps/website/docs/docs/usage/cli.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,28 +1,12 @@
import { Tab, Tabs } from '@rspress/core/theme';
import { PackageManagerTabs } from '@rspress/core/theme';

# @swc/cli

## Usage

Run the following to download pre-built binaries:

<Tabs>
<Tab label="pnpm">
```bash
pnpm add -D @swc/cli @swc/core
```
</Tab>
<Tab label="npm">
```bash
npm i -D @swc/cli @swc/core
```
</Tab>
<Tab label="yarn">
```bash
yarn add -D @swc/cli @swc/core
```
</Tab>
</Tabs>
<PackageManagerTabs command="install -D @swc/cli @swc/core" />

Then, you can transpile your files:

Expand Down Expand Up @@ -116,9 +100,7 @@ npx swc src --only **/*.js

To automatically recompile files on changes, install `chokidar`:

```sh
npm i -D chokidar
```
<PackageManagerTabs command="install -D chokidar" />

Then, add the `-w` flag:

Expand Down
20 changes: 2 additions & 18 deletions apps/website/docs/docs/usage/html.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,28 +2,12 @@
title: "@swc/html"
---

import { Tab, Tabs } from '@rspress/core/theme';
import { PackageManagerTabs } from '@rspress/core/theme';
import TypeDeclarations from '@components/TypeDeclarations';

## Installation

<Tabs>
<Tab label="pnpm">
```bash
pnpm add -D @swc/html
```
</Tab>
<Tab label="npm">
```bash
npm i -D @swc/html
```
</Tab>
<Tab label="yarn">
```bash
yarn add -D @swc/html
```
</Tab>
</Tabs>
<PackageManagerTabs command="install -D @swc/html" />

## Usage

Expand Down
20 changes: 2 additions & 18 deletions apps/website/docs/docs/usage/jest.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,28 +1,12 @@
import { Tab, Tabs } from '@rspress/core/theme';
import { PackageManagerTabs } from '@rspress/core/theme';

# @swc/jest

To make your Jest tests run faster, you can swap out the default JavaScript-based runner (`ts-jest`) for a [drop-in Rust replacement](https://github.com/swc-project/pkgs/tree/main/packages/jest) using SWC.

## Installation

<Tabs>
<Tab label="pnpm">
```bash
pnpm add -D jest @swc/core @swc/jest
```
</Tab>
<Tab label="npm">
```bash
npm i -D jest @swc/core @swc/jest
```
</Tab>
<Tab label="yarn">
```bash
yarn add -D jest @swc/core @swc/jest
```
</Tab>
</Tabs>
<PackageManagerTabs command="install -D jest @swc/core @swc/jest" />

## Usage

Expand Down
20 changes: 2 additions & 18 deletions apps/website/docs/docs/usage/swc-loader.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Tab, Tabs } from '@rspress/core/theme';
import { PackageManagerTabs } from '@rspress/core/theme';

# swc-loader

Expand All @@ -8,23 +8,7 @@ For Rspack users, you can use Rspack's [builtin:swc-loader](https://rspack.rs/gu

## Installation

<Tabs>
<Tab label="pnpm">
```bash
pnpm add -D @swc/core swc-loader
```
</Tab>
<Tab label="npm">
```bash
npm i -D @swc/core swc-loader
```
</Tab>
<Tab label="yarn">
```bash
yarn add -D @swc/core swc-loader
```
</Tab>
</Tabs>
<PackageManagerTabs command="install -D @swc/core swc-loader" />

## Usage

Expand Down
3 changes: 1 addition & 2 deletions apps/website/docs/playground/index.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
---
title: SWC Playground
sidebar: false
outline: false
pageType: custom
---

<iframe
Expand Down
1 change: 1 addition & 0 deletions apps/website/rspress.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,7 @@ export default defineConfig({
route: {
cleanUrls: true,
},
llms: true,
builderConfig: {
resolve: {
alias: {
Expand Down
8 changes: 8 additions & 0 deletions apps/website/src/styles/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,10 @@
min-width: 0;
}

.swc-callout .rp-codeblock {
--rp-code-title-bg: var(--rp-c-bg-soft);
}

/* MDX children come wrapped in <p>/<ul> with doc-theme margins; strip the
outer ones so content aligns with the emoji instead of sagging below it. */
.swc-callout__content > *:first-child {
Expand All @@ -72,6 +76,10 @@
color: oklch(0.372 0.044 257.287);
}

.swc-home > .rp-llms-container {
display: none;
}

.dark .swc-home {
color: oklch(0.929 0.013 255.508);
}
Expand Down
Loading