Serve client on 127.0.0.1:5400/client/index.js when running npm run dev#3302
Serve client on 127.0.0.1:5400/client/index.js when running npm run dev#3302
127.0.0.1:5400/client/index.js when running npm run dev#3302Conversation
…n dev` can auto-build client as necessary
There was a problem hiding this comment.
Pull request overview
Adds a Vite dev-server middleware to serve the built @wp-playground/client bundle at /client/ (mirroring production) and automatically triggers an Nx build when the bundle is missing or stale.
Changes:
- Added
serve-client-libraryVite plugin to serve/client/*fromdist/packages/playground/client. - Implemented auto-build and staleness detection (source mtime vs built
index.jsmtime). - Expanded
node:fsimports to support reading and stat’ing served files.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Replace runtime require('child_process') with a static import from
node:child_process, log stderr on build failures, and sanitize the
request URL to prevent path traversal and query-string issues.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 1 out of 1 changed files in this pull request and generated 3 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
@copilot Can you mark your comments that has been addressed as resolved? |
ashfame
requested review from
a team and
fellyph
and removed request for
a team
|
@ashfame we have a |
|
@bgrgicak It might, but won't be as convenient as just running a single command and having it work exactly as we have in production. |
… walk The recursive newestMtimeIn() directory walk was running on every /client/* request when the build was up-to-date, since stalenessWarned only flipped to true when staleness was detected. Now the check runs once on first request (or after a build), and Vite's file watcher resets it when client source files actually change. Made-with: Cursor
Wrap the `new URL(req.url, ...)` call in a try-catch so that malformed request URLs return a 400 instead of crashing the middleware with an unhandled exception. Made-with: Cursor
Move the ~170-line serve-client-library plugin out of vite.config.ts
into vite.serve-client-library.ts to keep the config declarative and
readable. Also removes the duplicate `import { exec }` that was
shadowed by the promisified version in the config.
Made-with: Cursor
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 2 out of 2 changed files in this pull request and generated 4 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
- Guard against EISDIR by checking isDirectory() before readFileSync - Switch watcher from 'change' to 'all' so new/deleted/renamed source files also mark the build as stale - Use relative() for path containment check in the watcher callback Made-with: Cursor
This pull request enhances the local development experience for the Playground website by adding a Vite plugin that serves the built
@wp-playground/clientlibrary at/client/, closely matching the production environment. The plugin also auto-builds the client library if it's missing and warns if the build is stale, ensuring developers always have an up-to-date client bundle available during development.Key changes:
Development server enhancements:
serve-client-library) invite.config.tsto serve the@wp-playground/clientlibrary at/client/, auto-build it if missing, and trigger a rebuild if source files are newer than the built output. This improves local development parity with production and reduces manual build steps.Utility improvements:
fsimports invite.config.tsto includereadFileSync,readdirSync, andstatSync, supporting the new plugin's file system operations.Motivation for the change, related issues
In external projects, when we need to modify playground code and run that to fix an issue, we were not able to fetch the client dynamically from local env, as we were doing it in production environment.
Related to https://linear.app/a8c/issue/ARC-1443/launch-on-wordpresscom-takes-30-seconds-without-any-loading-spinner
Testing Instructions (or ideally a Blueprint)
npm run devplayground.wordpress.nethost with127.0.0.1:5400for/remote.htmland/client/index.jsurls.