@babylonjs/core
Version:
Getting started? Play directly with the Babylon.js API using our [playground](https://playground.babylonjs.com/). It also contains a lot of samples to learn how to use it.
108 lines (70 loc) • 4.06 kB
Markdown
Getting started? Play directly with the Babylon.js API using our [playground](https://playground.babylonjs.com/). It also contains a lot of samples to learn how to use it.
[](https://www.npmjs.com/package/@babylonjs/core)
**Any questions?** Here is our official [forum](https://forum.babylonjs.com/).
For the UMD bundled distribution, see the [babylonjs](https://www.npmjs.com/package/babylonjs) package.
Babylon.js and its modules are published on npm as ES modules with full typing support. To install, use:
```text
npm install @babylonjs/core
```
This will allow you to import Babylon.js entirely using:
```javascript
import * as BABYLON from "@babylonjs/core/Legacy/legacy";
```
or individual classes to benefit from tree shaking:
```javascript
import { Scene } from "@babylonjs/core/scene";
import { Engine } from "@babylonjs/core/Engines/engine";
```
To add a module, install the respective package. A list of extra packages and their installation instructions can be found on the [@babylonjs scope on npm](https://www.npmjs.com/~babylonjs).
See [our ES6 dedicated documentation](https://doc.babylonjs.com/setup/frameworkPackages/es6Support/):
```javascript
import { Engine } from "@babylonjs/core/Engines/engine";
import { Scene } from "@babylonjs/core/scene";
import { Vector3 } from "@babylonjs/core/Maths/math.vector";
import { FreeCamera } from "@babylonjs/core/Cameras/freeCamera";
import { HemisphericLight } from "@babylonjs/core/Lights/hemisphericLight";
import { CreateSphere } from "@babylonjs/core/Meshes/Builders/sphereBuilder";
import { CreateGround } from "@babylonjs/core/Meshes/Builders/groundBuilder";
// Side-effect import allowing the standard material to be used as default.
import "@babylonjs/core/Materials/standardMaterial";
const canvas = document.getElementById("renderCanvas") as HTMLCanvasElement;
const engine = new Engine(canvas);
const scene = new Scene(engine);
// This creates and positions a free camera (non-mesh)
const camera = new FreeCamera("camera1", new Vector3(0, 5, -10), scene);
// This targets the camera to scene origin
camera.setTarget(Vector3.Zero());
// This attaches the camera to the canvas
camera.attachControl(canvas, true);
// This creates a light, aiming 0,1,0 - to the sky (non-mesh)
const light = new HemisphericLight("light1", new Vector3(0, 1, 0), scene);
// Default intensity is 1. Let's dim the light a small amount
light.intensity = 0.7;
// Our built-in 'sphere' shape
const sphere = CreateSphere("sphere1", { segments: 16, diameter: 2 }, scene);
// Move the sphere upward 1/2 its height
sphere.position.y = 1;
// Our built-in 'ground' shape
CreateGround("ground1", { width: 6, height: 6, subdivisions: 2 }, scene);
engine.runRenderLoop(() => {
scene.render();
});
```
- [Documentation](https://doc.babylonjs.com)
- [Examples](https://doc.babylonjs.com/examples)
Please see the [contribution guidelines](https://github.com/BabylonJS/Babylon.js/blob/master/contributing.md).
- Official web site: [www.babylonjs.com](https://www.babylonjs.com/)
- Online [playground](https://playground.babylonjs.com/) to learn by experimenting
- Online [sandbox](https://www.babylonjs.com/sandbox) where you can test your .babylon and glTF scenes with a simple drag'n'drop
- [glTF Tools](https://github.com/KhronosGroup/glTF#gltf-tools) by KhronosGroup
To get a complete list of supported features, please visit our [website](https://www.babylonjs.com/).
The [`@babylonjs/inspector`](https://www.npmjs.com/package/@babylonjs/inspector) package provides a diagnostic tool for understanding scene state and rendering. It includes a visual UI for humans and a CLI for AI agents. See the [Inspector documentation](https://doc.babylonjs.com/toolsAndResources/inspectorv2/) for more details.