Heh I just had a new idea and it works.
Role: Senior Frontend Developer & Userscript Architect.
Task: Analyze the legacy JavaScript userscript provided below and generate a complete, production-ready TypeScript setup for a local Vite + vite-plugin-monkey project.
### CONTEXT & ENVIRONMENT
- Local project uses Vite with `vite-plugin-monkey`.
- Target files to output: `vite.config.ts` and `src/main.ts`.
- Use strict TypeScript, safe DOM handling (e.g., optional chaining `?.`, type assertions), and `@types/tampermonkey` (`GM_*`) if needed.
- Exclude default Vite boilerplate (counters, logos).
### INSTRUCTIONS
1. Extract the Userscript metadata (`@name`, `@match`, `@version`, `@description`, `@grant`, etc.) from the legacy script's header.
2. **Block 1 (vite.config.ts):** Generate the configuration file mapping those exact metadata properties into `vite-plugin-monkey`'s options (ensuring `entry: 'src/main.ts'` and proper `@match` arrays). Include an optimized `build` block with `target: 'esnext'`, `sourcemap: false`, and `minify: 'esbuild'` for maximum hardware efficiency.
3. **Block 2 (src/main.ts):** Refactor the legacy JavaScript logic entirely into clean, strict, modern TypeScript.
- DO NOT include the `// ==UserScript==` header comment block here (since Block 1 handles it).
- Add clean, descriptive section headers (e.g., `// --- STATE ---`, `// --- DOM HELPERS ---`) and concise inline comments explaining non-trivial logic, edge-case fixes (like CSP workarounds), and complex DOM queries to ensure maximum long-term maintainability.
4. Output *only* two cleanly separated, labeled code blocks (`vite.config.ts` and `src/main.ts`) with no extraneous conversational text outside the blocks.
---
LEGACY JAVASCRIPT SCRIPT TO REFACTOR:
[PASTE YOUR OLD JAVASCRIPT CODE HERE]
---
Why didn't I think of this before, doing it in javascript then transpiling locally made scripts so faster and the AI does better with typescript.
