Skip to main content

​
Overview

The sunpeak build command creates optimized, production-ready bundles for your MCP Resources. Each Resource file is built as a separate, standalone HTML bundle. 
sunpeak build

​
Output

The build process creates:
  • HTML - Optimized and compressed for minimal file size
  • CSS extraction - Unused Tailwind styles removed automatically
  • Asset optimization - Static assets with hashed filenames for caching
  • Source maps - For debugging production issues

​
Output Directory

dist/
├── search/
│   ├── search.html                      # Built resource bundle
│   └── search.json                      # ResourceConfig (extracted from .tsx)
├── calendar/
│   ├── calendar.html
│   └── calendar.json
Each resource folder from src/resources/{name}/ is built to dist/{name}/, containing the HTML bundle and metadata. The .json file is extracted from the resource export in your .tsx file. Simulation files are not included in the build output.

​
Automatic Discovery

The build automatically discovers and builds all resource folders: 
src/resources/{name}/{name}-resource.tsx
For example:
  • src/resources/search/ → dist/search/search.html + dist/search/search.json
  • src/resources/calendar/ → dist/calendar/calendar.html + dist/calendar/calendar.json

​
Metadata JSON Files

The build extracts the resource export from each *-resource.tsx file and writes it to a JSON file with a generated uri field: 
{
  "name": "search",
  "title": "Search App",
  "description": "A search interface",
  "mimeType": "text/html;profile=mcp-app",
  "uri": "ui://search-mjdoy6rs",
  "_meta": { ... }
}
The uri is generated using the resource name and a build timestamp for cache invalidation.

​
Build Optimizations

​
Tree Shaking

Unused code is automatically removed from the bundle: 
// Only the imported components are included in the bundle
import { Card, Button } from 'sunpeak';

​
CSS Purging

Tailwind CSS automatically removes unused utility classes:
  • Only classes actually used in your components are included
  • Significantly reduces CSS file size
  • No manual configuration required

​
Usage

sunpeak build

​
Deployment

After building, deploy the dist/ directory to any static hosting service:

Deployment Guide

Learn how to deploy your built apps to production.