Getting Started

Installation

To start using Threlte, you can either scaffold a new project using the CLI or install the packages manually in an existing project.

Scaffold a new Threlte project

The easiest way to get started with Threlte is to use the command npm create threlte to scaffold a new project. This CLI will interactively guide you through creating a new SvelteKit project as well as installing and configuring Threlte and its dependencies.

npm create threlte my-project

Manually install Threlte in an existing project

Threlte consists of 7 packages which can be installed and used individually. @threlte/core and Three.js itself are required for all projects while the other packages are optional. @threlte/gltf does not need to be installed separately as it can be used with npx, the resulting Threlte components however require @threlte/extras to be installed.

Choose the packages you want to use

Configuration

Adapt vite.config.js

If you are using Threlte with SvelteKit, adapt your Vite configuration to prevent three from being externalized for SSR by vites externalization step

const config = {
  // …
  ssr: {
    noExternal: ['three']
  }
}

Adapt tsconfig.json

If you are using TypeScript, you need to add the following to your tsconfig.json to make sure that the types of the Threlte components are available:

{
  "compilerOptions": {
    "moduleResolution": "Bundler"
  }
}