feat(vite-config): support building from a single theme root#139
Merged
Conversation
YvetteNikolov
requested review from
FreakyWizard,
JasperS20,
WybeBosch,
Yannicvanveen,
Copilot,
laravdiemen and
rivanuff
There was a problem hiding this comment.
Pull request overview
Adds automatic “project root vs theme root” detection across the toolkit’s Vite, build/watch, lint/format, and config helpers so a single WordPress theme can run the full asset toolchain directly from its own directory (in addition to the existing Bedrock/Brave project-root layout).
Changes:
- Introduces
resolveThemeContext()utilities to detect brave-root (web/app/themes) vs theme-root (style.cssin cwd) and to normalize theme path resolution. - Updates Vite Brave configs (themes + blocks) to build/watch correctly in both layouts (including base/public paths and refresh globs).
- Extends related tooling (toolkit globs, block discovery, Prettier Tailwind stylesheet lookup, ESLint import aliases) to work from theme-root.
Reviewed changes
Copilot reviewed 20 out of 20 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/vite-config/src/utils/resolve-theme-context.js | New context resolver for brave-root vs theme-root (theme discovery + path helpers). |
| packages/vite-config/src/utils/get-all-theme-names.js | Switches to context-based theme listing (supports single-theme layout). |
| packages/vite-config/src/utils/generate-entry-points.js | Resolves theme directories via context (works from theme-root). |
| packages/vite-config/src/utils/generate-aliases.js | Generates aliases from context and adds theme-root @sage compatibility mapping. |
| packages/vite-config/src/configs/brave.js | Updates base/publicDirectory/refresh behavior to support theme-root builds and watches. |
| packages/vite-config/src/configs/brave-theme-blocks.js | Adjusts blocks output directory for theme-root and disables publicDir to avoid collisions. |
| packages/vite-config/README.md | Documents brave-root vs theme-root behavior for vite-config consumers. |
| packages/toolkit/src/utils/resolve-theme-context.js | New toolkit-side context resolver mirroring vite-config behavior. |
| packages/toolkit/src/utils/get-block-theme-name.js | New helper to derive a block’s owning theme name across both layouts (for logging). |
| packages/toolkit/src/utils/get-block-paths.js | Block discovery now iterates context themes and uses per-theme relative dirs. |
| packages/toolkit/src/utils/get-all-theme-names.js | Switches to context-based theme listing (supports theme-root). |
| packages/toolkit/src/scripts/watch-blocks.js | Uses getBlockThemeName() for layout-agnostic logging. |
| packages/toolkit/src/scripts/build-blocks.js | Uses getBlockThemeName() for layout-agnostic logging. |
| packages/toolkit/src/config/modes.js | Makes brave mode lint/format globs context-aware (theme-root vs brave-root). |
| packages/toolkit/README.md | Documents brave-root vs theme-root behavior for toolkit CLI usage. |
| packages/prettier-config/src/utils/find-tailwind-stylesheet.js | Searches Tailwind config stylesheet in both brave-root and theme-root candidate locations. |
| packages/prettier-config/README.md | Documents Tailwind stylesheet lookup across both layouts. |
| packages/eslint-config/src/utils/resolve-import-aliases.js | Adds dynamic import-alias resolution intended to support theme-root. |
| packages/eslint-config/src/index.js | Switches import/resolver alias config to the new resolver helper. |
| packages/eslint-config/README.md | Documents brave-root vs theme-root alias behavior for ESLint. |
Comment on lines
+13
to
+23
| const cwd = process.cwd(); | ||
| const isBraveRoot = fs.existsSync( path.resolve( cwd, 'web/app/themes' ) ); | ||
|
|
||
| if ( isBraveRoot ) { | ||
| return [ | ||
| [ '@sage/scripts', './web/app/themes/sage/resources/scripts' ], | ||
| ]; | ||
| } | ||
|
|
||
| const themeName = path.basename( cwd ); | ||
|
|
Comment on lines
+28
to
+41
| /** | ||
| * Block output directory: | ||
| * - theme-root: the theme's own `public` directory. | ||
| * - brave-root: the owning theme's public directory, derived from the | ||
| * `web/app/themes/<theme>/...` block path. | ||
| */ | ||
| const outDir = | ||
| context.mode === 'theme-root' | ||
| ? 'public' | ||
| : path.join( | ||
| 'web/app/themes', | ||
| blockPath.split( path.sep ).at( 3 ), | ||
| 'public' | ||
| ); |
Comment on lines
+55
to
+63
| return fs.readdirSync( themesDir ).filter( ( dirName ) => { | ||
| const fullPath = path.join( themesDir, dirName ); | ||
|
|
||
| if ( ! isDirectory( fullPath ) ) { | ||
| return false; | ||
| } | ||
|
|
||
| return fs.existsSync( path.join( fullPath, 'style.css' ) ); | ||
| } ); |
Comment on lines
+57
to
+65
| return fs.readdirSync( themesDir ).filter( ( dirName ) => { | ||
| const fullPath = path.join( themesDir, dirName ); | ||
|
|
||
| if ( ! isDirectory( fullPath ) ) { | ||
| return false; | ||
| } | ||
|
|
||
| return fs.existsSync( path.join( fullPath, 'style.css' ) ); | ||
| } ); |
Comment on lines
+23
to
+24
| * NOTE: kept in sync with the identical util in `@yardinternet/vite-config`. | ||
| */ |
Contributor
Author
There was a problem hiding this comment.
Maken we een aparte @yardinternet/toolkit-utils package van
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Voor de Mijn Omgeving moeten we ook een Vite build (en eigenlijk alle asset tooling) beschikbaar maken vanaf het thema-root, niet vanaf de root van het Project. Deze PR maakt dat mogelijk.
Je kunt nu:
vite.config.jsenvite-blocks.config.js+package.jsonzetten, dan depnpm watch/pnpm buildcommands draaien.web/app/themes/? Dan geldt Brave als root (zoals gewoonlijk). Bevat de huidige folder eenstyle.css? Dan geldt het thema als root.