### Clone all Rstack examples and run a specific one

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/README.md

This snippet provides instructions to clone the entire rstack-examples repository, navigate into a chosen example directory (e.g., Rsbuild react), enable pnpm with corepack, install dependencies, and start the development server.

```bash
git clone git@github.com:rspack-contrib/rstack-examples.git
cd rsbuild/react
# Use corepack to enable pnpm
corepack enable
pnpm i
pnpm run dev
```

--------------------------------

### Installing Dependencies and Running the Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/README.md

These commands enable pnpm using corepack, install the project dependencies using pnpm, and then start the development server for the Rsbuild React example.

```bash
# Use corepack to enable pnpm
corepack enable
pnpm i
pnpm run dev
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-components/README.md

This command starts the development server, typically with hot-reloading, allowing for local development and testing of the application.

```bash
pnpm dev
```

--------------------------------

### Clone and run a single Rstack example using gitpick

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/README.md

This snippet demonstrates how to clone a specific sub-directory example from the rstack-examples repository using `npx gitpick`, navigate into the cloned directory, and install its dependencies with pnpm.

```bash
# Clone the basic example
npx gitpick https://github.com/rspack-contrib/rstack-examples/tree/main/rspack/basic

# Enter the basic example directory
cd basic

# Install the dependencies
pnpm i
```

--------------------------------

### Running Monaco Editor Webpack Plugin Sample

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspack/monaco-editor-webpack-plugin/index.html

Commands to install dependencies, start a simple server, and build the project for the Monaco Editor Webpack Plugin sample.

```shell
$/> npm install .
$/> npm run simpleserver
$/browser-esm-webpack-monaco-plugin> npm run build
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-jsx/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies are updated.

```bash
pnpm install
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-components/README.md

This command installs all necessary project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change.

```bash
pnpm install
```

--------------------------------

### Start Development Server for Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/express/README.md

This command initiates the development server for the Rsbuild application. It typically includes features like hot module replacement for a smooth development experience.

```bash
pnpm dev
```

--------------------------------

### Start Development Server for Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/emotion/README.md

This command launches the development server for the Rsbuild project, enabling live reloading and hot module replacement for efficient local development.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/emotion/README.md

This command installs all required project dependencies using the pnpm package manager, ensuring a consistent and efficient setup for the Rsbuild project.

```bash
pnpm install
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express/README.md

This command initiates the development server for the Rsbuild project. It typically includes features like hot-reloading and live preview, making it suitable for active development and testing.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/express/README.md

This command installs all required project dependencies as defined in the package.json file, using the pnpm package manager. It should be run after cloning the repository or when new dependencies are added.

```bash
pnpm install
```

--------------------------------

### Start Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react/README.md

Starts the development server for the Rsbuild project, allowing for live development and testing.

```bash
pnpm dev
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-jsx/README.md

This command starts the development server for the Rsbuild project, enabling live reloading and local development. It's typically used during active development.

```bash
pnpm dev
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-auto-import/README.md

This command initiates the development server for the Rsbuild project. It typically includes features like hot module reloading, enabling real-time preview and efficient development of the application.

```bash
pnpm dev
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-components/README.md

This command allows you to preview the production-ready build locally, simulating how it would behave once deployed without needing a full server setup.

```bash
pnpm preview
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss-v4/README.md

This command installs all necessary project dependencies as defined in the project's package.json file using the pnpm package manager. It should be run after cloning the repository or when new dependencies are added to ensure all required packages are available.

```bash
pnpm install
```

--------------------------------

### Start Rsbuild Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/stylex/README.md

Starts the local development server for the Rsbuild project. This allows developers to view and test their application in real-time during development.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run after cloning the repository or when new dependencies are added to ensure all necessary packages are available.

```bash
pnpm install
```

--------------------------------

### Start Development Server (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-mdx/README.md

Starts the development server for the Rsbuild project, enabling live reloading and local development.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-auto-import/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change to ensure all necessary packages are available.

```bash
pnpm install
```

--------------------------------

### Start Development Server for Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss-v4/README.md

This command initiates the development server for the Rsbuild project, enabling features like hot module replacement and live reloading. It's typically used during active development to see changes instantly.

```bash
pnpm dev
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/emotion/README.md

This command compiles and optimizes the Rsbuild application for production deployment, generating optimized assets and bundles ready for distribution.

```bash
pnpm build
```

--------------------------------

### Start Rsbuild Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue2/README.md

Starts the development server for the Rsbuild application. This allows for live reloading and development previews.

```bash
pnpm dev
```

--------------------------------

### Preview Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/emotion/README.md

This command allows you to locally preview the optimized production build of the Rsbuild application, verifying its functionality and performance before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/fastify/README.md

This command starts the development server for the Rsbuild project. It enables hot-reloading and provides a local environment for development, allowing real-time preview of changes.

```bash
pnpm dev
```

--------------------------------

### Install Rsbuild Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-eslint/README.md

Installs all project dependencies using pnpm. Run this command after cloning the repository or when `package.json` changes to ensure all required packages are available for development and building.

```bash
pnpm install
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/express/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates static assets and bundles them for efficient delivery.

```bash
pnpm build
```

--------------------------------

### Build and Start NestJS Project with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspack/nestjs/README.md

These commands are used to compile the NestJS application and then launch it. 'pnpm run build' compiles the TypeScript source code into JavaScript, and 'pnpm run start' executes the compiled application.

```js
pnpm run build
pnpm run start
```

--------------------------------

### Build Application for Production with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-components/README.md

This command compiles and optimizes the application for production deployment, generating static assets and an optimized build.

```bash
pnpm build
```

--------------------------------

### Install dependencies for Rsbuild project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/lit/README.md

This command installs all necessary project dependencies using pnpm.

```bash
pnpm install
```

--------------------------------

### Start Rsbuild Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/preact/README.md

This command starts the development server for the Rsbuild project. It enables hot module replacement and live reloading for efficient development.

```bash
pnpm dev
```

--------------------------------

### Install Dependencies for Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express-with-manifest/README.md

Installs all necessary project dependencies using pnpm.

```bash
pnpm install
```

--------------------------------

### Install Project Dependencies

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react/README.md

Installs all necessary project dependencies using the pnpm package manager.

```bash
pnpm install
```

--------------------------------

### Start Development Server (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-compiler-babel/README.md

Starts the development server for the Rsbuild project, enabling live reloading and hot module replacement for efficient development.

```bash
pnpm dev
```

--------------------------------

### Preview Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/express/README.md

This command allows you to locally preview the optimized production build of the Rsbuild application. It simulates how the application will behave once deployed to a production environment.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-jsx/README.md

This command allows you to locally preview the production-ready build of the Rsbuild application. It's useful for verifying the optimized output before deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-auto-import/README.md

This command allows you to locally preview the production-ready build of the Rsbuild application. It is useful for verifying the optimized output before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Start development server for Rsbuild project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/lit/README.md

This command starts the development server, typically with hot-reloading, for the Rsbuild project.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/fastify/README.md

This command installs all necessary project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change to ensure all required packages are available.

```bash
pnpm install
```

--------------------------------

### Preview Rsbuild Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss/README.md

Starts a local server to preview the production-ready build of the Rsbuild application, allowing verification before deployment.

```bash
pnpm preview
```

--------------------------------

### Start Rsbuild Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-eslint/README.md

Starts the local development server for the Rsbuild project. This command enables live reloading and hot module replacement, facilitating rapid development and testing.

```bash
pnpm dev
```

--------------------------------

### Install Rsbuild Project Dependencies

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/preact/README.md

This command installs all necessary project dependencies using pnpm. It should be run once after cloning the repository or when dependencies change.

```bash
pnpm install
```

--------------------------------

### Install Rsbuild Project Dependencies

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss/README.md

This command installs all necessary project dependencies using pnpm, preparing the project for development or building.

```bash
pnpm install
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3/README.md

This command starts the development server, typically with hot-reloading, allowing for local development and testing of the Rsbuild application.

```bash
pnpm dev
```

--------------------------------

### Build Rsbuild Application for Production with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/styled-jsx/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates optimized assets and bundles for efficient loading.

```bash
pnpm build
```

--------------------------------

### Preview Rsbuild production build locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vanilla-extract/README.md

This command starts a local server to preview the production-ready build of the Rsbuild application. It's useful for verifying the optimized output, checking performance, and ensuring everything works as expected before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Build Application for Production with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-auto-import/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates static assets and an optimized build, ready for hosting.

```bash
pnpm build
```

--------------------------------

### Start Rsbuild development server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-element-plus/README.md

This command starts the development server for the Rsbuild project. It enables live reloading and hot module replacement, facilitating efficient development workflows.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-mdx/README.md

Installs all necessary project dependencies using pnpm, ensuring the project is ready for development or build operations.

```bash
pnpm install
```

--------------------------------

### Install Project Dependencies (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-compiler-babel/README.md

Installs all required project dependencies using pnpm. This command should be run once after cloning the repository or when dependencies are updated.

```bash
pnpm install
```

--------------------------------

### Start Rsbuild Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/svelte/README.md

This command starts the development server for the Rsbuild project, enabling live reloading and local development. It's typically used during active development to see changes in real-time.

```bash
pnpm dev
```

--------------------------------

### Start Development Server for Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express-with-manifest/README.md

Starts the development server for the Rsbuild project, typically with hot-reloading.

```bash
pnpm dev
```

--------------------------------

### Start Rsbuild development server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/solid/README.md

This command starts the development server for the Rsbuild project, enabling live reloading and local development. It's typically used during active development to see changes in real-time without manual refreshes.

```bash
pnpm dev
```

--------------------------------

### Install project dependencies (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-jest/README.md

Installs all necessary project dependencies using the pnpm package manager. This command should be run after cloning the repository to prepare the project for development.

```bash
pnpm install
```

--------------------------------

### Start the Rsbuild development server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vanilla-extract/README.md

This command initiates the development server for the Rsbuild project. It typically includes features like hot module replacement and live reloading, making it suitable for active development and testing changes in real-time.

```bash
pnpm dev
```

--------------------------------

### Install dependencies for Rsbuild project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/shadcn-ui/README.md

This command installs all necessary project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies are updated.

```bash
pnpm install
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express/README.md

This command allows you to locally preview the production-ready build of the Rsbuild application. It's useful for verifying the built output and testing its behavior before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss-v4/README.md

This command allows you to locally preview the production-ready build of the Rsbuild application. It's useful for verifying the built output and ensuring everything works as expected before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/stylex/README.md

Installs all required project dependencies using the pnpm package manager. This command should be run after cloning the repository or when new dependencies are added.

```bash
pnpm install
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-vant/README.md

This command starts the development server for the Rsbuild project, enabling live reloading and local development. It's typically used during active development.

```bash
pnpm dev
```

--------------------------------

### Start development server for Rsbuild project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/shadcn-ui/README.md

This command initiates the local development server for the Rsbuild project. It typically includes features like hot module replacement for a smooth development experience.

```bash
pnpm dev
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3/README.md

This command installs all necessary project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change.

```bash
pnpm install
```

--------------------------------

### Basic Markdown Syntax Example

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Illustrates a fundamental Markdown file structure with a simple H1 heading, demonstrating basic content creation in Rspress.

```md
# Hello World
```

--------------------------------

### Preview local production build

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-eslint/README.md

Starts a local server to preview the production-ready build of the Rsbuild application. This is useful for verifying the built output before deployment.

```bash
pnpm preview
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-vant/README.md

This command installs all necessary project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change.

```bash
pnpm install
```

--------------------------------

### Install project dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/solid/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change to ensure all necessary packages are available for development and building.

```bash
pnpm install
```

--------------------------------

### Start Development Server with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/umd/README.md

This command starts the development server for the Rsbuild project. It enables features like hot-reloading and provides a local URL to access the application during development, facilitating rapid iteration.

```bash
pnpm dev
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss-v4/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates a highly optimized and minified set of static assets ready for hosting on a web server.

```bash
pnpm build
```

--------------------------------

### Start Rsbuild development server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/query-raw/README.md

This command initiates the development server for the Rsbuild project, enabling live reloading and local development. It is typically used during active development cycles to see changes instantly.

```bash
pnpm dev
```

--------------------------------

### Install project dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-element-plus/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies are updated.

```bash
pnpm install
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue2/README.md

Installs all necessary project dependencies using the pnpm package manager. This command should be run once after cloning the repository or when dependencies change.

```bash
pnpm install
```

--------------------------------

### Start Rsbuild Development Server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss/README.md

Initiates the development server for the Rsbuild project, enabling live reloading and local testing during development.

```bash
pnpm dev
```

--------------------------------

### Install project dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vanilla-extract/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change to ensure all necessary packages are available.

```bash
pnpm install
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/svelte/README.md

This command installs all necessary project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change to ensure all required packages are available.

```bash
pnpm install
```

--------------------------------

### Start Rsbuild development server (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-jest/README.md

Starts the development server for the Rsbuild project, enabling live reloading and local development. This command is typically used during active development.

```bash
pnpm dev
```

--------------------------------

### Install project dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-eslint/README.md

Installs all required project dependencies using the pnpm package manager. This command should be run after cloning the repository or when new dependencies are added.

```bash
pnpm install
```

--------------------------------

### Install project dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/query-raw/README.md

This command installs all required project dependencies using the pnpm package manager. It should be executed once after cloning the repository or whenever the project's dependencies are updated.

```bash
pnpm install
```

--------------------------------

### Build Production Application with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates static assets and prepares the application for efficient serving in a production environment.

```bash
pnpm build
```

--------------------------------

### Install Project Dependencies with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/umd/README.md

This command installs all required project dependencies using the pnpm package manager. It should be run once after cloning the repository or when dependencies change to ensure all necessary packages are available.

```bash
pnpm install
```

--------------------------------

### Start the Rsbuild development server

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-eslint/README.md

Launches the development server for the Rsbuild project, enabling live reloading and local development. This command is typically used during active development.

```bash
pnpm dev
```

--------------------------------

### Creating Custom Containers with ::: Syntax

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Provides examples of the `:::` syntax for creating various types of custom containers (e.g., tip, info, warning, danger, details) and demonstrates how to include custom titles for these blocks.

```markdown
:::tip
This is a `block` of type `tip`
:::

:::info
This is a `block` of type `info`
:::

:::warning
This is a `block` of type `warning`
:::

:::danger
This is a `block` of type `danger`
:::

::: details
This is a `block` of type `details`
:::

:::tip Custom Title
This is a `block` of `Custom Title`
:::

:::tip{title="Custom Title"}
This is a `block` of `Custom Title`
:::
```

--------------------------------

### Basic Robots.txt Configuration

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspack/cra-ts/public/robots.txt

This robots.txt file allows all user agents to crawl the entire website by specifying an empty Disallow directive. It's a common configuration for sites that want full indexation and do not have specific paths to restrict.

```Robots.txt
User-agent: *
Disallow:
```

--------------------------------

### JSX Component with Inline Styles and Markdown

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-mdx/src/hello.mdx

This JSX snippet defines a div element with inline styles for background color and padding. It demonstrates how to embed markdown-like text within a JSX component.

```JSX
<div style={{ backgroundColor: 'gray', padding: '1rem' }}>
  Try and change the background color to `tomato`.
</div>
```

--------------------------------

### EJS Template for HTML Webpack Plugin Title

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspack/svelte/index.html

This snippet shows an EJS (Embedded JavaScript) template tag used to inject the `title` option from `html-webpack-plugin` into an HTML document. It's commonly used in webpack-based projects to dynamically set page titles.

```EJS
<%= htmlWebpackPlugin.options.title %>
```

--------------------------------

### JavaScript: Update DOM with Custom Library Function

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/umd/src/index.html

This snippet retrieves an HTML element by its ID ('test') and updates its inner text with the result of a function call to `window.myLib.double(1)`. It demonstrates basic DOM manipulation and integration with a global custom library.

```JavaScript
document.getElementById('test').innerText = window.myLib.double(1);
```

--------------------------------

### Preview Rsbuild Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-eslint/README.md

Launches a local server to preview the production-ready build of the Rsbuild application. This is useful for verifying the optimized output and performance before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/stylex/README.md

Compiles and bundles the Rsbuild application for production deployment. This command generates optimized assets ready for hosting.

```bash
pnpm build
```

--------------------------------

### Preview Production Build Locally (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-mdx/README.md

Serves the production-ready build locally, allowing for testing and verification before deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/fastify/README.md

This command allows you to preview the previously built production application locally. It's useful for verifying the production output and ensuring everything works as expected before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3/README.md

This command allows you to locally serve and test the production-ready build of the Rsbuild application before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build of Rsbuild Project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express-with-manifest/README.md

Launches a local server to preview the production-ready build of the Rsbuild application.

```bash
pnpm preview
```

--------------------------------

### Preview Rsbuild production build locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/query-raw/README.md

This command allows you to locally serve and preview the production-ready build of the Rsbuild application. It is useful for verifying the compiled output and ensuring everything works as expected before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Rsbuild Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue2/README.md

Serves the production build locally to allow for testing and verification before deployment. This simulates the production environment.

```bash
pnpm preview
```

--------------------------------

### Preview Local Production Build

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/stylex/README.md

Launches a local server to preview the production-ready build of the Rsbuild application. This is useful for verifying the built assets before deployment.

```bash
pnpm preview
```

--------------------------------

### Preview production build locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/solid/README.md

This command allows you to preview the production-ready build of the Rsbuild application locally. It simulates how the application would behave after deployment, which is useful for final checks before pushing to production.

```bash
pnpm preview
```

--------------------------------

### Preview Production Build Locally (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-compiler-babel/README.md

Serves the production build locally to allow testing the optimized application before deployment. This simulates a production environment.

```bash
pnpm preview
```

--------------------------------

### Build Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react/README.md

Compiles and bundles the Rsbuild application for production deployment, optimizing it for performance.

```bash
pnpm build
```

--------------------------------

### Preview Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react/README.md

Serves the production-ready build locally, allowing for a final check before deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Rsbuild production build locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-element-plus/README.md

This command allows you to locally preview the production-ready build of the Rsbuild application. It simulates how the application would behave in a deployed environment.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue2/README.md

Compiles and bundles the Rsbuild application for production deployment. This command generates optimized assets ready for hosting.

```bash
pnpm build
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-vant/README.md

This command allows you to preview the production-ready build of the Rsbuild application locally, simulating how it would behave in a production environment without deploying.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild Application for Production with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/fastify/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates optimized assets and bundles ready for hosting on a production server.

```bash
pnpm build
```

--------------------------------

### Preview production build locally for Rsbuild project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/lit/README.md

This command allows you to locally preview the optimized production build of the Rsbuild application.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-eslint/README.md

Compiles and optimizes the Rsbuild application for production deployment. This process generates optimized assets, typically placed in a `dist` directory, ready for hosting.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild application for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/lit/README.md

This command compiles and optimizes the Rsbuild application for production deployment.

```bash
pnpm build
```

--------------------------------

### Build Production Application (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-mdx/README.md

Compiles and bundles the Rsbuild application for production deployment, optimizing assets and code.

```bash
pnpm build
```

--------------------------------

### Preview production build locally for Rsbuild project

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/shadcn-ui/README.md

After building the application for production, this command allows you to locally preview the optimized build. This is useful for verifying the production output before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild application for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/shadcn-ui/README.md

This command compiles and optimizes the Rsbuild application for production deployment. The output is typically placed in a 'dist' directory, ready for static hosting.

```bash
pnpm build
```

--------------------------------

### Preview production build locally (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-jest/README.md

Serves the production build locally, allowing for testing and verification of the optimized application before actual deployment. This simulates a production environment.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild app for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/solid/README.md

This command compiles and optimizes the Rsbuild application for production deployment. The output is typically found in a 'dist' or 'build' directory, ready to be served by a web server.

```bash
pnpm build
```

--------------------------------

### Preview Rsbuild Production Build Locally

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/preact/README.md

This command allows you to preview the production build of the Rsbuild application locally. It's useful for verifying the built output before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/preact/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates a production-ready build in the output directory.

```bash
pnpm build
```

--------------------------------

### Preview Production Build Locally with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/umd/README.md

This command allows you to preview the production-ready build of the Rsbuild application locally. It's useful for verifying the optimized output and ensuring everything works as expected before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Preview Local Production Build

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/svelte/README.md

This command allows you to locally preview the production-ready build of the Rsbuild application. It's useful for verifying the build output and ensuring everything works as expected before actual deployment.

```bash
pnpm preview
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/svelte/README.md

This command compiles and optimizes the Rsbuild application for production deployment. The output is typically placed in a 'dist' or 'build' directory, ready for hosting on a server.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild application for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-eslint/README.md

Compiles and optimizes the Rsbuild application for production deployment. This command generates the final static assets ready for hosting.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild application for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-element-plus/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates static assets in the output directory, ready for hosting.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild application for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vanilla-extract/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates a highly optimized and minified output, typically placed in a 'dist' or 'build' directory, ready for deployment to a web server.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild Project for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/ssr-express-with-manifest/README.md

Compiles and optimizes the Rsbuild application for production deployment.

```bash
pnpm build
```

--------------------------------

### Build Production Application (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-compiler-babel/README.md

Builds the Rsbuild application for production, optimizing assets and code for deployment. The output is typically placed in a 'dist' directory.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild Application for Production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-tailwindcss/README.md

Compiles and optimizes the Rsbuild application for production deployment, generating static assets and an optimized build.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild application for production

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/query-raw/README.md

This command compiles and optimizes the Rsbuild application for production deployment. The resulting optimized assets are usually placed in a 'dist' or 'build' directory, ready for hosting on a web server.

```bash
pnpm build
```

--------------------------------

### Build Production Application with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3/README.md

This command compiles and optimizes the Rsbuild application for production deployment, generating static assets in a build directory.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild Application for Production with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/umd/README.md

This command compiles and optimizes the Rsbuild application for production deployment. It generates optimized static assets, minified code, and other production-ready files suitable for hosting.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild Application for Production with pnpm

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/vue3-vant/README.md

This command compiles and optimizes the Rsbuild application for production deployment. The output is typically found in a 'dist' or 'build' directory.

```bash
pnpm build
```

--------------------------------

### Build Rsbuild app for production (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-jest/README.md

Builds the Rsbuild application for production, optimizing assets and code for deployment. The output is typically placed in a 'dist' or 'build' directory.

```bash
pnpm build
```

--------------------------------

### Run unit tests with Jest (pnpm)

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rsbuild/react-jest/README.md

Executes unit tests for the Rsbuild project using Jest. This command is essential for verifying the correctness and functionality of the codebase.

```bash
pnpm test
```

--------------------------------

### Basic Robots.txt Configuration for Full Access

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspack/cra/public/robots.txt

This snippet provides a basic robots.txt configuration that allows all web crawlers to access all content on the website. The 'User-agent: *' directive applies the rule to all bots, and 'Disallow:' with no path explicitly permits crawling of the entire site. It's commonly used when no specific restrictions are needed.

```Robots.txt
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:
```

--------------------------------

### Basic Code Block Syntax and Titles

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Demonstrates the fundamental triple backtick syntax for creating code blocks, including how to specify the language and add an optional title to the block.

```md
```js
console.log('Hello World');
```

```js title="hello.js"
console.log('Hello World');
```
```

--------------------------------

### Integrating React Components in MDX Files

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Demonstrates how to import and embed React components directly within MDX files. This requires naming the content file with a .mdx extension.

```mdx
// docs/index.mdx
import { CustomComponent } from './custom';

# Hello World

<CustomComponent />
```

--------------------------------

### Defining YAML Front Matter for Metadata

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Shows how to add YAML-formatted Front Matter at the beginning of a Markdown or MDX file to define page-specific metadata, such as the title.

```yaml
---
title: Hello World
---
```

--------------------------------

### Code Block with Line Highlighting and Title

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Shows how to apply line highlighting and a title to a code block in Markdown.  This allows for focusing on specific lines of code.

```js
console.log('Hello World');

const a = 1;

console.log(a);

const b = 2;

console.log(b);
```

--------------------------------

### Applying Line Highlighting to Code Blocks

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Illustrates how to highlight specific lines within a code block and combine this feature with a code block title using curly braces after the language specifier.

```md
```js title="hello.js" {1,3-5}
console.log('Hello World');

const a = 1;

console.log(a);

const b = 2;

console.log(b);
```
```

--------------------------------

### Configure Rspress Markdown for Code Blocks

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Shows how to modify `rspress.config.ts` to enable advanced features for code blocks, such as displaying line numbers and enabling default code wrapping.

```ts
export default {
  // ...
  markdown: {
    showLineNumbers: true,
  },
};
```

```ts
export default {
  // ...
  markdown: {
    defaultWrapCode: true,
  },
};
```

--------------------------------

### Enabling Code Wrapping in Rspress Config

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Demonstrates how to enable code wrapping for long lines by setting the `defaultWrapCode` option in the Rspress configuration file.

```ts
export default {
  // ...
  markdown: {
    defaultWrapCode: true,
  },
};
```

--------------------------------

### Accessing Front Matter Properties in Markdown

Source: https://github.com/rspack-contrib/rstack-examples/blob/main/rspress/basic/docs/guide/index.md

Illustrates how to dynamically access and display properties defined in the Front Matter directly within the Markdown content using template syntax, which are passed as `frontmatter` properties to components.

```markdown
---
title: Hello World
---

# {frontmatter.title}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.