Nx plugin for Angular Three providing generators and utilities for 3D application development.
All public APIs are documented with JSDoc comments. Your IDE will provide inline documentation, parameter hints, and examples as you code.
Please visit Angular Three Documentation
npm install -D angular-three-plugin
# yarn add -D angular-three-plugin
# pnpm add -D angular-three-pluginInitializes Angular Three in your application. This generator:
- Installs
angular-three,three,@types/three, andngxtension - Enables
skipLibCheckin tsconfig for Three.js compatibility - Adds
provideNgtRenderer()to your application providers - Optionally generates a starter SceneGraph component
nx g angular-three-plugin:initOptions:
| Option | Description | Default |
|---|---|---|
sceneGraph |
How to generate the SceneGraph component | 'generate-only' |
SceneGraph options:
append- Append to parent component templatereplace- Replace parent component templategenerate-only- Generate component but don't modify templatenone- Don't generate a SceneGraph component
Adds auxiliary Angular Three packages to your project:
nx g angular-three-plugin:auxAvailable packages:
angular-three-soba- Utilities and abstractionsangular-three-rapier- Rapier physics engineangular-three-postprocessing- Post-processing effectsangular-three-cannon- Cannon.js physics engineangular-three-tweakpane- Tweakpane UI controlsangular-three-theatre- Theatre.js animation toolkit
Generates an Angular component from a GLTF/GLB 3D model:
nx g angular-three-plugin:gltf --modelPath=src/assets/model.glb --output=src/app/model.tsOptions:
| Option | Description | Default |
|---|---|---|
modelPath |
Path to GLTF/GLB model | Required |
output |
Output path for generated component | Required |
className |
Component class name | 'Model' |
selectorPrefix |
Component selector prefix | 'app' |
draco |
Use DracoLoader for compressed models | null |
shadows |
Enable shadow casting/receiving | false |
transform |
Transform meshes via gltf-transform | false |
instance |
Instance re-occurring geometry | false |
bones |
Layout bones declaratively | false |
console |
Print output to console instead of file | false |