T / createT

The T namespace contains components that wrap three.js objects, allowing you to insert them into your scene declaratively. You create the namespace using the createT() factory function:

import { createT } from "solid-three"
import * as THREE from "three"

// Create T namespace with all three.js objects
const T = createT(THREE)

// Now you can use T components
<T.Mesh>
  <T.BoxGeometry args={[1, 1, 1]} />
  <T.MeshBasicMaterial color="hotpink" />
</T.Mesh>

You can also create a namespace with specific objects for tree-shaking purposes:

import { createT } from "solid-three"
import { Mesh, BoxGeometry, MeshBasicMaterial } from "three"

// Create T namespace with only specific objects
const T = createT({ Mesh, BoxGeometry, MeshBasicMaterial })

Usage patterns

• In applications — create a single T and export it for use throughout your app.
• In libraries — create scoped T namespaces for tree-shaking, or use <Entity/> instead.
• Multiple namespaces — create several T instances to lazy-load different parts of three.js.

See also

• <Entity/> — the namespace-free form, plus createEntity for a single typed component.
• useProps — how props on every <T.*> component are applied.