create-three-flatland 0.0.0 → 0.1.0-alpha.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +65 -0
- package/package.json +1 -1
- package/templates/react/package.json +1 -1
- package/templates/three/package.json +1 -1
package/README.md
ADDED
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
<p align="center">
|
|
2
|
+
<img src="https://raw.githubusercontent.com/thejustinwalsh/three-flatland/main/assets/repo-banner.png" alt="three-flatland" width="100%" />
|
|
3
|
+
</p>
|
|
4
|
+
|
|
5
|
+
# create-three-flatland
|
|
6
|
+
|
|
7
|
+
Scaffold a [three-flatland](https://www.npmjs.com/package/three-flatland) project — a minimal, Vite-powered WebGPU 2D starter in either plain [Three.js](https://threejs.org/) or [React Three Fiber](https://r3f.docs.pmnd.rs/). An interactive sprite scene, a Suspense loading overlay, oxlint/oxfmt, and ready-to-run unit + Playwright tests, with `AGENTS.md`/`CLAUDE.md` so coding agents know the ropes.
|
|
8
|
+
|
|
9
|
+
> **Alpha Release** — this package is in active development. The API will evolve and breaking changes are expected between releases. Pin your version and check the [changelog](https://github.com/thejustinwalsh/three-flatland/releases) before upgrading.
|
|
10
|
+
|
|
11
|
+
[](https://www.npmjs.com/package/create-three-flatland)
|
|
12
|
+
[](https://github.com/thejustinwalsh/three-flatland/blob/main/LICENSE)
|
|
13
|
+
|
|
14
|
+
## Usage
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
# npm
|
|
18
|
+
npm create three-flatland@latest
|
|
19
|
+
|
|
20
|
+
# pnpm
|
|
21
|
+
pnpm create three-flatland
|
|
22
|
+
|
|
23
|
+
# yarn
|
|
24
|
+
yarn create three-flatland
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
You'll be prompted for a project directory and a template. Then:
|
|
28
|
+
|
|
29
|
+
```bash
|
|
30
|
+
cd my-app
|
|
31
|
+
npm install
|
|
32
|
+
npm run dev
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
### Non-interactive
|
|
36
|
+
|
|
37
|
+
Pass the target directory and template as arguments (create-vite-compatible flags):
|
|
38
|
+
|
|
39
|
+
```bash
|
|
40
|
+
npm create three-flatland@latest my-app -- --template three
|
|
41
|
+
npm create three-flatland@latest my-app -- --template react
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
| Flag | Meaning |
|
|
45
|
+
| --- | --- |
|
|
46
|
+
| `-t, --template <name>` | Template to scaffold: `three` \| `react` |
|
|
47
|
+
| `--overwrite` | Scaffold into a non-empty target directory |
|
|
48
|
+
| `--help` | Show usage |
|
|
49
|
+
|
|
50
|
+
## Templates
|
|
51
|
+
|
|
52
|
+
| Template | Stack |
|
|
53
|
+
| --- | --- |
|
|
54
|
+
| `three` | Plain Three.js + WebGPU (`three/webgpu` + TSL) on Vite |
|
|
55
|
+
| `react` | React Three Fiber (`@react-three/fiber/webgpu`) on Vite |
|
|
56
|
+
|
|
57
|
+
Both render an interactive sprite scene, share the same loading overlay, and ship with linting, formatting, unit tests, and Playwright end-to-end tests wired up.
|
|
58
|
+
|
|
59
|
+
## Documentation
|
|
60
|
+
|
|
61
|
+
Full docs, guides, and interactive examples at **[tjw.dev/three-flatland](https://tjw.dev/three-flatland/)**.
|
|
62
|
+
|
|
63
|
+
## License
|
|
64
|
+
|
|
65
|
+
[MIT](./LICENSE)
|
package/package.json
CHANGED