myvibe-publish
MyVibe Publish
Publish web content (HTML file, ZIP archive, or directory) to MyVibe.
Usage
# Publish a ZIP file
/myvibe:myvibe-publish --file ./dist.zip
# Publish a single HTML file
/myvibe:myvibe-publish --file ./index.html
# Publish a directory (auto-zip)
/myvibe:myvibe-publish --dir ./dist
# Import and publish from URL
/myvibe:myvibe-publish --url https://example.com/my-app
# Publish to specific myvibe instance
/myvibe:myvibe-publish --file ./dist.zip --hub https://custom-hub.com
Options
| Option | Alias | Description |
|---|---|---|
--file <path> |
-f |
Path to HTML file or ZIP archive |
--dir <path> |
-d |
Directory to compress and publish |
--url <url> |
-u |
URL to import and publish |
--hub <url> |
-h |
MyVibe URL (default: https://staging.myvibe.so/) |
--title <title> |
-t |
Project title |
--desc <desc> |
Project description | |
--visibility <vis> |
-v |
Visibility: public or private (default: public) |
Workflow
CRITICAL: You MUST read reference files before starting analysis
Before starting any analysis, you MUST use the Read tool to read:
references/metadata-analysis.md- Detailed metadata extraction and tags matching workflow
Workflow Overview
- Detect Project Type → determine if build is needed
- Build (if needed) → compile the project
- Metadata Analysis → extract title, description, tags, screenshot
- Confirm Publish → show metadata, get user confirmation
- Execute Publish → upload to MyVibe
IMPORTANT: Step 3 (Metadata Analysis) is ALWAYS required, including after build.
1. Detect Project Type
Determine what type of project this is and what the publish target will be.
Target directory: --dir if specified, otherwise current working directory.
Project Type Detection
| Check | Project Type | Next Step |
|---|---|---|
--file with HTML file |
Single HTML | → Step 3 (analyze the HTML file) |
--file with ZIP file |
ZIP Archive | → Step 3 (extract and analyze) |
Has dist/index.html, build/index.html, or out/index.html |
Pre-built | → Step 2 (confirm rebuild or use existing) |
Has package.json with build script, no output folder |
Buildable | → Step 2 (build first) |
Has multiple package.json files or workspace config |
Monorepo | → Step 2 (select app, then build) |
Has index.html at root, no package.json |
Static | → Step 3 (analyze root directory) |
| Cannot determine | Unknown | → Step 3 (analyze as-is) |
Output format:
Project Type Detection:
- Type: [type]
- Reason: [why this type was detected]
- Publish target: [directory or file path]
- Next step: [Step 2: Build / Step 3: Metadata Analysis]
2. Build Decision (for Pre-built/Buildable/Monorepo projects)
Detect Build Configuration
Package Manager (from lock files):
| Lock File | Package Manager |
|---|---|
pnpm-lock.yaml |
pnpm |
yarn.lock |
yarn |
bun.lockb or bun.lock |
bun |
package-lock.json |
npm |
| None | npm (default) |
Build Command (from package.json scripts):
- Priority:
build:prod>build:production>build
Output Directory (from config files):
| Config File | Expected Output |
|---|---|
vite.config.* |
dist |
next.config.* |
.next or out |
webpack.config.* |
dist |
astro.config.* |
dist |
nuxt.config.* |
.output |
| None recognized | Check dist, build, out in order |
Show Analysis & Confirm Build
Present the analysis to user:
Project Analysis:
- Type: [framework] project
- Package Manager: [pm]
- Build Command: [pm] run build
- Output Directory: [dir]
Warnings (if any):
- Missing .env file (.env.example exists)
- Large files detected (> 10MB)
For Pre-built projects (existing build output found), use AskUserQuestion:
Question: "Found existing build output in [dir]/. Rebuild to ensure latest?"
Header: "Build"
Options:
- Label: "Rebuild & Publish"
Description: "Run build again, then publish [dir]/"
- Label: "Use Existing"
Description: "Publish existing [dir]/ without rebuilding"
- Label: "Publish Source"
Description: "Skip output folder, publish source as-is"
For Buildable projects (no build output), use AskUserQuestion:
Question: "Proceed with build before publishing?"
Header: "Build"
Options:
- Label: "Build & Publish"
Description: "Run build, then publish [output_dir]/"
- Label: "Publish Source"
Description: "Skip build, publish source as-is"
Execute Build (if confirmed)
cd [project_dir] && [pm] install && [pm] run build
On build failure:
- Analyze error output
- Offer to help fix common issues (missing dependencies, config errors)
- User can choose to fix and retry, or publish source as-is
After build completes: Proceed to Step 3: Metadata Analysis with the build output directory as the publish target.
Monorepo Handling
When multiple package.json files detected, use AskUserQuestion:
Question: "Monorepo detected. Which app would you like to publish?"
Header: "App"
Options:
- Label: "[apps/web]"
Description: "[framework] detected in apps/web"
- Label: "[apps/admin]"
Description: "[framework] detected in apps/admin"
- Label: "Other"
Description: "Specify a different path"
After selecting and building the app, proceed to Step 3: Metadata Analysis.
3. Metadata Analysis
CRITICAL: This step is MANDATORY for ALL project types, including after build.
Follow references/metadata-analysis.md completely. Each step MUST output results:
- Extract metadata (title, description, githubRepo)
- Fetch and match tags
- Generate screenshot
If screenshot fails, skip coverImage and let server auto-generate.
4. Confirm Publish
Present all extracted metadata to the user:
Publishing to MyVibe:
──────────────────────
Title: [extracted title]
Description:
[generated story, 50-150 words]
Visibility: public
Source: [directory path]
GitHub: [repo URL or "Not detected"]
Cover Image: [screenshot URL or "Will be auto-generated"]
Tags (auto-detected):
- Tech Stack: [matched tag names, e.g., "React, TypeScript, Vite"]
- Platform: [matched tag names or "None"]
- Category: [suggested category or "None"]
- Model: [detected AI models or "None"]
Use AskUserQuestion to confirm:
Question: "Confirm publish with these details?"
Header: "Publish"
Options:
- Label: "Publish"
Description: "Publish with the metadata shown above"
- Label: "Edit details"
Description: "Modify title, description, tags, or other fields"
If user selects "Edit details", collect corrections via follow-up questions.
5. Execute Publish
Only after user confirmation in Step 4, execute the publish script.
Dependency Check Strategy:
- Check if
skills/myvibe-publish/scripts/node_modulesdirectory exists - If not exists: run
npm installfirst - If publish fails with module errors: run
npm installand retry
Method 1: Using Config File (Recommended for full metadata)
Write a YAML config file with all metadata, then publish:
# Write config file in current directory
# File: ./publish-config.yaml
source:
type: dir
path: ./dist
hub: https://staging.myvibe.so
metadata:
title: My App
description: A cool web application
visibility: public
coverImage: https://...
githubRepo: https://github.com/user/repo
platformTags: [1, 2]
techStackTags: [3, 4, 5]
categoryTags: [6]
modelTags: [7]
# Publish using config file
node skills/myvibe-publish/scripts/publish.mjs --config ./publish-config.yaml
The config file is automatically deleted after successful publish.
Method 2: Command Line Arguments (Simple cases)
# Publish a directory
node skills/myvibe-publish/scripts/publish.mjs \
--dir ./dist \
--hub https://staging.myvibe.so \
--title "My App" \
--desc "A cool app" \
--visibility public
# Publish a file
node skills/myvibe-publish/scripts/publish.mjs \
--file ./dist.zip \
--hub https://staging.myvibe.so \
--title "My App"
# Import from URL
node skills/myvibe-publish/scripts/publish.mjs \
--url https://example.com/my-app \
--hub https://staging.myvibe.so
Script Output:
On success:
Published successfully!
URL: https://staging.myvibe.so/{userDid}/{vibeDid}
6. Return Result
- On success: Show the published URL to the user
- On failure: Show the error message and suggest solutions
Error Handling
| Error | Handling |
|---|---|
| Dependencies not installed | Run npm install in scripts directory |
| 401/403 Authorization error | Token will be cleared automatically, re-run to authorize again |
| Upload failed | Show error message, suggest checking file format |
| Conversion failed | Show conversion error from API |
| Network error | Suggest retry |
| Build failed | Analyze error, offer to help fix, or publish source as-is |
| Missing dependencies | Run [pm] install first |
| Config error | Check framework config files |
| Screenshot failed | Skip coverImage, proceed without it |
| agent-browser not installed | Run npm install -g agent-browser && agent-browser install |
| agent-browser Chromium missing | Run agent-browser install (or --with-deps on Linux) |
| Tags fetch failed | Use expired cache if available, or skip tag matching |
| Image upload failed | Skip coverImage, proceed without it |
Authorization
The script handles authorization automatically:
- First run opens browser for user to authorize
- Token is saved for future use
- On 401/403 errors, token is cleared and user needs to re-authorize on next run
Notes
- Always analyze content before publishing to generate meaningful title/description
- Never use directory names as title - they are often meaningless
- Confirm with user before executing publish
- Default hub is https://staging.myvibe.so/
- Local build detection is preprocessing only; server has its own build pipeline
- Be conservative: if project type is uncertain, publish as-is and let server handle
--dirspecifies target directory and requires full metadata analysis--filespecifies single file and also requires metadata analysis and screenshot generation- Build detection should not block publishing
- Tags are cached locally for 7 days to avoid repeated API calls
- All auto-detected metadata should be shown as "suggestions" - user can modify
- If screenshot fails, skip coverImage and let server auto-generate
- Use config file method when publishing with extended metadata (tags, coverImage, etc.)