--- sidebar_position: 1 title: Static File Format description: Understand the static JSON file format used by the Myop self-hosting export. Each component is a JSON file that matches the Myop consume API response. keywords: [myop static format, component json, export format, self-hosting files] --- # Static File Format The export produces a directory of JSON files. Each file matches the exact response format of the Myop `/consume` API, so the SDK can parse them identically. ## Directory Structure ``` myop-static/ manifest.json components/ {componentId}/ production.json staging.json preview.json ``` ## manifest.json An index of all exported components. Used for tooling and debugging — the SDK does not read this file. ```json { "version": 1, "exportedAt": "2026-03-23T10:00:00.000Z", "organization": "org-abc-123", "components": [ { "id": "comp-uuid-1", "name": "Pricing Table" }, { "id": "comp-uuid-2", "name": "Onboarding Flow" } ] } ``` ## Component Files Each `{componentId}/{environment}.json` file contains the full component data needed to render it: ```json { "item": { "name": "Pricing Table", "id": "comp-uuid-1", "organizationId": "org-abc-123", "consume_variant": [ { "id": "variant-uuid", "name": "Default", "loader": { "type": "HTMLLoader", "HTML": "...", "shadowRootMode": "localFrame", "autoHeight": true } } ] } } ``` ### Environment Files | File | Description | |------|-------------| | `production.json` | The variant released to the `production` environment | | `staging.json` | The variant released to `staging` (if exists) | | `preview.json` | The latest variant regardless of release status | Only environments with an active release are exported. If a component has no release for `staging`, there will be no `staging.json`. ## URL Resolution When the SDK is in static mode, it constructs URLs as: ``` GET ${baseUrl}/components/${componentId}/${environment}.json ``` For example, with `enableSelfHosted('https://cdn.example.com/myop')`: ``` https://cdn.example.com/myop/components/comp-uuid-1/production.json ``` ## CORS Configuration Your CDN/S3 bucket must allow cross-origin requests from your application domain. Example S3 CORS: ```json [ { "AllowedHeaders": ["*"], "AllowedMethods": ["GET"], "AllowedOrigins": ["https://app.yourcompany.com"], "MaxAgeSeconds": 86400 } ] ```