Browse Source

docs: Add development server instructions to README and memory bank

- Add prominent warning to always use 'npm run dev' instead of 'open index.html'
- Explain why Vite dev server is required (CORS, ES6 modules, hot reloading)
- Update memory bank with critical development server requirements
- Ensure Cline remembers proper development workflow
Billie Hilton 4 months ago
parent
commit
cca080c91c
2 changed files with 42 additions and 2 deletions
  1. 34 1
      README.md
  2. 8 1
      memory-bank/current.md

+ 34 - 1
README.md

@@ -1,3 +1,36 @@
 # dawdlehorn
 
-The dawdle horn is a Digital Audio Workstation / Groovebox / musical instrument that's controlled via a gamepad. Probably uses the web Gamepad API, along with Web MIDI and Web Audio APIs.
+The dawdle horn is a Digital Audio Workstation / Groovebox / musical instrument that's controlled via a gamepad. Uses the web Gamepad API, along with Web MIDI and Web Audio APIs.
+
+## Development
+
+**Important: Always use the development server, not direct file opening**
+
+To run the development server:
+```bash
+npm run dev
+```
+
+This starts the Vite development server which is required for:
+- ES6 module imports to work properly
+- Hot reloading during development
+- Proper CORS handling for web APIs
+- Audio context initialization (requires user interaction)
+
+**Do NOT use `open index.html`** - this will not work properly due to CORS restrictions and missing module resolution.
+
+## Getting Started
+
+1. Install dependencies:
+   ```bash
+   npm install
+   ```
+
+2. Start the development server:
+   ```bash
+   npm run dev
+   ```
+
+3. Open your browser to the URL shown in the terminal (typically `http://localhost:5173`)
+
+4. Connect a gamepad and start making music!

+ 8 - 1
memory-bank/current.md

@@ -33,9 +33,16 @@ Implemented a comprehensive gamepad mapping solution to address vanilla Gamepad
 ## Current Understanding
 - Target: Gamepad-controlled groovebox/DAW
 - Core APIs: Web Gamepad, Web Audio, Web MIDI
-- Environment: Browser-based, no server required
+- Environment: Browser-based with Vite dev server
 - Focus: Real-time performance and low latency
 
+## Development Server Requirements
+**CRITICAL: Always use `npm run dev` to start the development server**
+- **NEVER use `open index.html`** - this will fail due to CORS and module resolution issues
+- Vite dev server is required for ES6 modules, hot reloading, and proper web API access
+- Development URL: typically `http://localhost:5173`
+- Audio context requires user interaction, which the dev server handles properly
+
 ## Technical Plan Summary
 **Selected Stack:**
 - **Audio**: Tone.js + Audio Worklets for synthesis and effects