thatopen-agents-viewer-builder

Scaffold a Vite + TypeScript ThatOpen BIM viewer with IFC loading.

17|1|Updated Mar 20, 2026
One-click install
npx skills add https://github.com/Impertio-Studio/ThatOpen-Claude-Skill-Package --skill thatopen-agents-viewer-builder-impertio-studio
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: thatopen-agents-viewer-builder
Source: https://github.com/Impertio-Studio/ThatOpen-Claude-Skill-Package/tree/main/skills/source/thatopen-agents/thatopen-agents-viewer-builder
Command: npx skills add https://github.com/Impertio-Studio/ThatOpen-Claude-Skill-Package --skill thatopen-agents-viewer-builder-impertio-studio

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill prevents incomplete or broken ThatOpen BIM viewer setups by guiding you through an end-to-end scaffold that includes all required dependencies, configuration, and working initialization order.

Core Features & Use Cases

  • End-to-end viewer scaffolding: Creates a Vite + TypeScript starter (vanilla-ts) and wires the full ThatOpen rendering pipeline.
  • Correct BIM runtime setup: Ensures COOP/COEP headers for web-ifc WASM, proper Vite WASM handling, and deterministic initialization order.
  • Working BIM interactions: Adds IFC loading from file input, click-to-select highlighting, camera fitting after load, and a functional toolbar/panel UI layout.

Quick Start

Use this Skill when you’re ready to scaffold a new ThatOpen BIM viewer project from scratch and want a complete working example you can run immediately.

Frequently Asked Questions about thatopen-agents-viewer-builder

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

FAQPage Schema
How do I scaffold a ThatOpen BIM viewer with Vite and TypeScript?

Scaffolding a ThatOpen BIM viewer involves setting up a Vite + TypeScript project, installing proper package versions, configuring web-ifc WASM, and initializing the world scene, renderer, and camera in a deterministic order to enable functional IFC loading and rendering.

Why does web-ifc WASM require COOP and COEP headers in a Vite project?

COOP and COEP headers are required by web-ifc WASM to achieve cross-origin isolation for multi-threaded WebAssembly execution. This Skill ensures proper Vite WASM handling and header configuration so the BIM viewer can load IFC models without runtime errors.

What is the correct initialization order for ThatOpen components when building a BIM viewer?

The correct initialization order requires setting up the world scene, renderer, and camera sequentially, configuring the ifcLoader before any load operations, and finally integrating BUI custom elements for selection and highlighting. This Skill enforces this deterministic sequence.

Can I use ThatOpen components to add click-to-select highlighting and IFC file loading?

Yes, ThatOpen components support IFC file loading from file input and click-to-select highlighting. This Skill scaffolds these working BIM interactions out of the box, along with automatic camera fitting after model load and a functional toolbar and panel UI layout.

What are common limitations when configuring a ThatOpen BIM viewer from scratch?

Common limitations include incorrect package versions, missing COOP/COEP headers for web-ifc WASM, improper Vite WASM handling, and broken BUI initialization order. This Skill prevents these incomplete setups by providing an end-to-end scaffold with correct configuration.