Skip to content
AI & Agents
Skill

/pixijs-create

Use this skill when scaffolding a new PixiJS v8 project with the create-pixi CLI or adding PixiJS to an existing project. Covers npm/yarn/pnpm/bun create commands, interactive vs non-interactive flows, bundler vs creation template categories, available template presets

From plugin
pixijs-skills
30226 skills
Install
$ npx -y skills add pixijs/pixijs-skills --skill pixijs-create --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

  • Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.Auto-invocation is when the right skill fires by itself at the right moment, driven by a FLOW.md router and a hook, instead of you invoking it by name. It is the difference between a skill being installed and a skill actually getting used.Read the full definition →
  • You can call itInvoke it directly when you want it.
  • Slash command/pixijs-create

Context preview

The summary Claude sees to decide when to auto-load this skill.

Use this skill when scaffolding a new PixiJS v8 project with the create-pixi CLI or adding PixiJS to an existing project. Covers npm/yarn/pnpm/bun create commands, interactive vs non-interactive flows, bundler vs creation template categories, available template presets

SKILL.md

pixijs-create.SKILL.md
name: pixijs-create
description: "Use this skill when scaffolding a new PixiJS v8 project with the create-pixi CLI or adding PixiJS to an existing project. Covers npm/yarn/pnpm/bun create commands, interactive vs non-interactive flows, bundler vs creation template categories, available template presets (bundler-vite, bundler-webpack, bundler-esbuild, bundler-import-map, creation-web, framework-react, extension-default), Node version requirements, `npm install pixi.js` for existing projects, post-scaffold dev flow, and the Vite top-level-await production-build gotcha. Triggers on: create pixi.js, npm create, npm install pixi.js, scaffold, template, bundler-vite, bundler-webpack, creation-web, framework-react, new project, existing project, getting started, quick start."
license: MIT

`create pixi.js` is the official CLI for scaffolding a new PixiJS v8 project. Run it with any package manager (`npm`, `yarn`, `pnpm`, `bun`) and pick a template from the interactive menu, or pass `--template` to skip prompts. It writes a self-contained project folder; you then `cd` in, install dependencies, and run the dev script.

Quick Start

Scaffold a new project with interactive prompts:

npm create pixi.js@latest

Or skip prompts by passing a project name and template:

npm create pixi.js@latest my-game -- --template bundler-vite

Then:

cd my-game
npm install
npm run dev

Requires Node.js 18+ or 20+. Some templates (notably `creation-web` and `framework-react`) may require a newer Node version; the package manager will warn if so.

Adding PixiJS to an existing project

If you already have a bundler, framework, or project set up, skip the CLI and install the package directly:

npm install pixi.js

Then import from `pixi.js` and construct an `Application` as shown in `pixijs-application`. The CLI templates are a convenience for new projects; they don't add anything to the library that `npm install pixi.js` can't give you.

**Related skills:** `pixijs-application` (how the scaffolded `new Application()` + `app.init()` entry point works), `pixijs-core-concepts` (renderers and the render loop), `pixijs-scene-core-concepts` (scene graph fundamentals for the first things you'll add to the stage), `pixijs-assets` (loading textures, fonts, and bundles the template expects you to drop into `public/` or `src/assets/`).

Core Patterns

Choose a package manager

The command is the same shape for every package manager:

npm create pixi.js@latest
yarn create pixi.js
pnpm create pixi.js
bun create pixi.js

Under npm 7+ you must pass a `--` before CLI flags so npm doesn't consume them:

npm create pixi.js@latest my-game -- --template bundler-vite

Yarn, pnpm, and bun don't need the extra separator:

yarn create pixi.js my-game --template bundler-vite
pnpm create pixi.js my-game --template bundler-vite
bun create pixi.js my-game --template bundler-vite

Use `.` as the project name to scaffold into the current directory.

Interactive flow

Running with no arguments walks through prompts:

1. Project name (defaults to `pixi-project`). 2. Framework / template category. 3. Variant (TypeScript vs JavaScript where applicable). 4. Whether to install dependencies immediately (some runners).

At the end, the CLI prints the `cd` + install + dev commands for the manager you invoked it with.

Non-interactive flow

Pass a project name and `--template` to skip all prompts. This is the form you want for scripts, CI, and quickstart docs:

npm create pixi.js@latest my-game -- --template bundler-vite

Available template presets

Templates fall into two categories:

  • **Bundler templates** (`bundler-*`): generic PixiJS setup wired up with your bundler of choice. Use one of these when you want to pick your own structure.
  • **Creation templates** (`creation-*`): platform-tailored starters with extras already wired in (AssetPack, sound, UI, scene routing). Use one of these when you want batteries included.
  • **Framework templates** (`framework-*`): PixiJS embedded inside a host framework like React.
  • **Extension templates** (`extension-*`): scaffolding for building a reusable PixiJS package.

For most new projects, `bundler-vite` is the recommended starting point.

| Template | What you get | | -------------------- | ------------------------------------------------------------------------------------------------------------ | | `bundler-vite` | Vite + TypeScript PixiJS project. The default first-stop template. | | `bundler-vite-js` | Vite + plain JavaScript. | | `bundler-webpack` | Webpack + TypeScript. | | `bundler-webpack-js` | Webpack + plain JavaScript. | | `bundler-esbuild` | esbuild + TypeScript. | | `bundler-esbuild-js` | esbuild + plain JavaScript. | | `bundler-import-map` | No-bundler setup using a browser import map (good for learning / demos). | | `creation-web` | PixiJS Creation Engine web template with scene-based game scaffolding, AssetPack, sound, and UI integration. | | `framework-react` | React + TypeScript + PixiJS via the `@pixi/react` package. | | `framework-react-js` | React + plain JavaScript + PixiJS. | | `extension-default` | Starter for building a

Read more
Ships withpixijs-skills

Official AI skills for PixiJS. These skills teach AI coding agents how to correctly use PixiJS

Get the whole plugin

Other skills on pixijs-skills.