perf: omit unused UI CSS and minify final bundles
This commit is contained in:
@@ -40,6 +40,7 @@ import {
|
||||
headToString,
|
||||
renderProductionFontHead,
|
||||
findStyleEntry,
|
||||
bundleCss,
|
||||
renderStyles,
|
||||
resolveThemeConfig,
|
||||
renderThemeCss,
|
||||
@@ -401,12 +402,16 @@ export async function runBuild(appRoot: string): Promise<void> {
|
||||
console.log(`✓ Theme: ${theme.names.length} themes (default: ${theme.default})`);
|
||||
|
||||
// 1a2) Wire UI stylesheet (all component classes, themed via tokens).
|
||||
const uiStyles = uiCss();
|
||||
const uiStyles = config.styles?.includeUi === false ? "" : uiCss();
|
||||
writeFileSync(join(distDir, "ui.css"), uiStyles, "utf8");
|
||||
const frameworkStyles = `${themeCss}\n${uiStyles}`;
|
||||
writeFileSync(join(distDir, "framework.css"), frameworkStyles, "utf8");
|
||||
assetHash.update(uiStyles);
|
||||
console.log(`✓ UI: dist/ui.css + framework.css`);
|
||||
console.log(
|
||||
config.styles?.includeUi === false
|
||||
? `✓ UI: omitted by styles.includeUi`
|
||||
: `✓ UI: dist/ui.css + framework.css`,
|
||||
);
|
||||
|
||||
// 1a3) Validation: bake schema descriptors into the client script.
|
||||
const descriptors: Record<string, SchemaDescriptor> = {};
|
||||
@@ -447,8 +452,12 @@ export async function runBuild(appRoot: string): Promise<void> {
|
||||
},
|
||||
config.styles,
|
||||
);
|
||||
assetHash.update(css);
|
||||
const combinedCss = `${frameworkStyles}\n${css}`;
|
||||
const combinedSource = `${frameworkStyles}\n${css}`;
|
||||
const combinedInput = join(distDir, ".wrnexus-combined.css");
|
||||
writeFileSync(combinedInput, combinedSource, "utf8");
|
||||
const combinedCss = await bundleCss(combinedInput, "production");
|
||||
rmSync(combinedInput, { force: true });
|
||||
assetHash.update(combinedCss);
|
||||
// One blocking CSS request in production: tokens → UI → application CSS.
|
||||
// The standalone framework.css remains available for apps without global CSS.
|
||||
writeFileSync(join(distDir, "styles.css"), combinedCss, "utf8");
|
||||
|
||||
@@ -42,6 +42,8 @@ export interface StyleProcessContext {
|
||||
export interface StylesConfig {
|
||||
/** Path to the CSS entry, relative to the app root. Default: app/styles/global.css */
|
||||
entry?: string;
|
||||
/** Include the complete @wrnexus/ui component catalog stylesheet. Default true. */
|
||||
includeUi?: boolean;
|
||||
/**
|
||||
* Optional custom processor. Return the final CSS string. Use this to run
|
||||
* Tailwind, PostCSS, Sass, etc. When omitted, the built-in Bun CSS bundler is
|
||||
|
||||
Reference in New Issue
Block a user