replit/timmy-tower
2
0
Fork 0
Code Issues 26 Pull Requests 5 Actions Packages Projects Releases Wiki Activity

[Matrix] Vite Build System — bundle Three.js, remove CDN dependency #61

New Issue
Closed
opened 2026-03-21 00:44:52 +00:00 by replit · 2 comments
replit commented 2026-03-21 00:44:52 +00:00
Owner
Copy Link

What & Why

The Matrix currently loads Three.js and all addons from esm.sh CDN at runtime. This means the app cannot load offline, the CDN is a hard runtime dependency, and there is no asset optimization, tree-shaking, or source maps. The iPad PWA use case requires a proper build — and this is the prerequisite for the service worker / PWA manifest task.

Done looks like

  • npm run build in the-matrix repo produces a working dist/ with all Three.js assets bundled locally
  • npm run dev starts a Vite dev server with hot reload
  • App loads with zero CDN network requests after first visit
  • No esm.sh URLs remain in any source file
  • Three.js version locked in package.json at 0.171.0
  • dist/ and node_modules/ in .gitignore

Out of scope

  • Service worker / offline caching (in the PWA manifest task, which depends on this one)
  • Changes to Three.js scene logic or UI

Tasks

  1. package.json + Vite devDep — Create package.json with three@0.171.0 as dep and vite as devDep. Add dev, build, preview scripts.
  2. Convert imports — Replace all esm.sh CDN URLs in js/*.js with bare specifier imports (import * as THREE from "three", import { OrbitControls } from "three/addons/controls/OrbitControls.js", etc.).
  3. index.html cleanup — Remove any <script type="importmap"> or CDN <link> tags. Ensure <script type="module" src="./js/main.js"> is the only entry point.
  4. Vite config — Add minimal vite.config.js if needed for base path or alias config. Confirm npm run build outputs to dist/ and npm run preview serves it.
  5. .gitignore — Add node_modules/ and dist/.

Relevant files

  • the-matrix/index.html
  • the-matrix/js/main.js
  • the-matrix/js/world.js
  • the-matrix/js/agents.js
  • the-matrix/js/websocket.js
## What & Why The Matrix currently loads Three.js and all addons from esm.sh CDN at runtime. This means the app cannot load offline, the CDN is a hard runtime dependency, and there is no asset optimization, tree-shaking, or source maps. The iPad PWA use case requires a proper build — and this is the prerequisite for the service worker / PWA manifest task. ## Done looks like - `npm run build` in `the-matrix` repo produces a working `dist/` with all Three.js assets bundled locally - `npm run dev` starts a Vite dev server with hot reload - App loads with zero CDN network requests after first visit - No `esm.sh` URLs remain in any source file - Three.js version locked in `package.json` at `0.171.0` - `dist/` and `node_modules/` in `.gitignore` ## Out of scope - Service worker / offline caching (in the PWA manifest task, which depends on this one) - Changes to Three.js scene logic or UI ## Tasks 1. **package.json + Vite devDep** — Create `package.json` with `three@0.171.0` as dep and `vite` as devDep. Add `dev`, `build`, `preview` scripts. 2. **Convert imports** — Replace all `esm.sh` CDN URLs in `js/*.js` with bare specifier imports (`import * as THREE from "three"`, `import { OrbitControls } from "three/addons/controls/OrbitControls.js"`, etc.). 3. **index.html cleanup** — Remove any `<script type="importmap">` or CDN `<link>` tags. Ensure `<script type="module" src="./js/main.js">` is the only entry point. 4. **Vite config** — Add minimal `vite.config.js` if needed for base path or alias config. Confirm `npm run build` outputs to `dist/` and `npm run preview` serves it. 5. **.gitignore** — Add `node_modules/` and `dist/`. ## Relevant files - `the-matrix/index.html` - `the-matrix/js/main.js` - `the-matrix/js/world.js` - `the-matrix/js/agents.js` - `the-matrix/js/websocket.js`
replit added the frontend label 2026-03-21 00:44:52 +00:00
claude was assigned by Rockachopa 2026-03-22 23:37:11 +00:00
claude commented 2026-03-23 01:40:33 +00:00
Collaborator
Copy Link

All requirements for this issue are already implemented on main:

  • ✅ package.json with three@0.171.0 as dep, vite as devDep, and dev/build/preview scripts
  • ✅ npm run build produces a working dist/ with all Three.js assets bundled locally
  • ✅ npm run dev starts Vite dev server with hot reload
  • ✅ No esm.sh URLs remain in any source file — all imports use bare specifiers (import * as THREE from "three")
  • ✅ index.html has no importmap — single <script type="module" src="./js/main.js"> entry point
  • ✅ dist/ and node_modules/ in .gitignore
  • ✅ vite.config.js configured with build output, dev server proxy, and service worker generation

This issue can be closed as already complete.

All requirements for this issue are already implemented on `main`: - ✅ `package.json` with `three@0.171.0` as dep, `vite` as devDep, and `dev`/`build`/`preview` scripts - ✅ `npm run build` produces a working `dist/` with all Three.js assets bundled locally - ✅ `npm run dev` starts Vite dev server with hot reload - ✅ No `esm.sh` URLs remain in any source file — all imports use bare specifiers (`import * as THREE from "three"`) - ✅ `index.html` has no `importmap` — single `<script type="module" src="./js/main.js">` entry point - ✅ `dist/` and `node_modules/` in `.gitignore` - ✅ `vite.config.js` configured with build output, dev server proxy, and service worker generation This issue can be closed as already complete.
claude commented 2026-03-23 20:15:29 +00:00
Collaborator
Copy Link

PR created: #89

The Vite build system was already mostly in place on main (bare specifier imports from three, package.json with three@0.171.0, vite.config.js, .gitignore with dist/ and node_modules/). This PR:

  1. Untracks dist/ from git — it was previously committed despite being in .gitignore; running git rm --cached removes it from version control
  2. Updates package-lock.json — regenerated after clean npm install

npm run build produces a working bundled dist/ with no CDN references.

PR created: #89 The Vite build system was already mostly in place on `main` (bare specifier imports from `three`, `package.json` with `three@0.171.0`, `vite.config.js`, `.gitignore` with `dist/` and `node_modules/`). This PR: 1. **Untracks `dist/` from git** — it was previously committed despite being in `.gitignore`; running `git rm --cached` removes it from version control 2. **Updates `package-lock.json`** — regenerated after clean `npm install` `npm run build` produces a working bundled `dist/` with no CDN references.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
ai
backend
frontend
lightning
mobile
mobile
nostr
workshop
No Label frontend
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
claude gemini replit
No Assignees claude
2 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: replit/timmy-tower#61
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?