single-html-bundling
CommunityShip an offline, mobile-first single HTML app.
Software Engineering#single-file#build script#cytoscape#responsive UI#offline web#JSON embedding#localStorage progress
Authoramazingsyp
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill eliminates the complexity of packaging a multi-file web app into a single offline deliverable, so learners can open one HTML file and start immediately on mobile, tablet, or desktop.
Core Features & Use Cases
- Single-file bundling for offline learning: Inlines HTML template, CSS, JS (including Cytoscape), and large JSON datasets into one distributable
dist/index.html. - Deterministic build pipeline with
build.js: Reads source assets fromsrc/and generated datasets from_workspace/, then outputs a final offline artifact. - Mobile-first responsive UX: Ensures the output UI supports hamburger sidebar patterns, bottom navigation, and theme toggling with persistent progress stored in
localStorage. - Data embedding via JSON script blobs: Injects datasets as
<script type="application/json" id="data-...">for runtime loading without network calls.
Quick Start
Run the build script to generate dist/index.html that bundles all required assets and JSON data into a single offline file.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: single-html-bundling Download link: https://github.com/amazingsyp/pokemon-ontology/archive/main.zip#single-html-bundling Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.