skills.rest
MrCull
MrCullCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

adding-a-sim

Generate a sim folder structure with definition.ts and Vue component.

1|Updated Mar 26, 2026
Search Tags:#typescript#vue#scaffold#project-setup#sims#starter-files#definition.ts
One-click install
npx skills add https://github.com/MrCull/shipping-container-sims --skill adding-a-sim
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: adding-a-sim
Source: https://github.com/MrCull/shipping-container-sims/tree/main/.ai/skills/adding-a-sim
Command: npx skills add https://github.com/MrCull/shipping-container-sims --skill adding-a-sim

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This tool automates scaffolding a new sim by generating the required folder structure, starter files, and metadata inside src/sims/ so teams can add a game quickly while keeping a consistent architecture.

Core Features & Use Cases

  • Auto-creates a self-contained sim folder with standard layout (definition.ts, root Vue component, and per-sim subfolders like components, composables, modules, store, types, assets)
  • Provides a ready-to-export definition.ts with id, title, description, icon, status, and dynamic import path
  • Ensures auto-discovery via useSimRegistry.ts by scanning src/sims/*/definition.ts
  • Guides starting points for sim root component and three recommended subfolders
  • Validates naming conventions (lowercase kebab-case id) to ensure compatibility

Quick Start

Create a new folder under src/sims using a lowercase kebab-case id, add a definition.ts exporting the required fields, place the root Vue component, and follow the described folder structure to enable auto-discovery

Frequently Asked Questions about adding-a-sim

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a new sim in a Vue and TypeScript project?▼

Scaffolding a new sim requires creating a folder under src/sims with a definition.ts file exporting id, title, description, icon, and a root Vue component to enable auto-discovery via useSimRegistry.ts.

What is the required folder structure for auto-discovering sims in a Vue project?▼

The required folder structure for auto-discovering sims places sim-specific code under src/sims/<sim-id>, containing a definition.ts file, a root Vue component, and subfolders like components, composables, and store scanned by useSimRegistry.ts.

What metadata needs to be in definition.ts for a new sim?▼

The definition.ts file must export an id, title, description, icon, status, and a dynamic import path for the root component to ensure proper sim registration.

Does my sim id need to follow a specific naming convention?▼

Yes, your sim id must follow a lowercase kebab-case naming convention to validate compatibility with the project's auto-discovery mechanism and folder structure.

How does sim auto-discovery work in this project setup?▼

Sim auto-discovery works by scanning src/sims/*/definition.ts paths using useSimRegistry.ts to dynamically import root Vue components and register exported metadata.

Related Skills

Explore More Software Engineering Skills→
trotsky1997trotsky1997
5

init-translator

Initialize a Zotero translator scaffold with metadata and Web translator type.

Community
Intermediate
OneWave-AIOneWave-AI
245

game-builder

Transform educational content into playable browser games with Phaser.js or Kaboom.js.

Official
Advanced
PatternsDevPatternsDev
235

dynamic-components

Switch Vue components dynamically using the is binding and KeepAlive.

Official
Intermediate
steebchensteebchen

dojo-init

Bootstrap complete Dojo projects with standardized scaffolding and configuration files.

Community
Intermediate