Skip to content

fix: prevent splitChunks from emptying app.css in dev mode#241

Closed
arbrandes wants to merge 1 commit intoopenedx:mainfrom
arbrandes:fix-dev-chunk-optimization
Closed

fix: prevent splitChunks from emptying app.css in dev mode#241
arbrandes wants to merge 1 commit intoopenedx:mainfrom
arbrandes:fix-dev-chunk-optimization

Conversation

@arbrandes
Copy link
Copy Markdown
Contributor

Description

When shell/style.ts was introduced in the CSS cascade layers commit, Paragon, shell, and brand CSS started being processed through MiniCssExtractPlugin as separate module imports rather than inlined via SCSS @use. This gives HtmlWebpackPlugin a CSS asset to link for the app entry - but splitChunks: { chunks: 'all' } moves the content to a numbered chunk, leaving app.css empty. HtmlWebpackPlugin injects the <link href="/app.css"> tag regardless, resulting in a 404 on every dev server reload.

The fix adds a cacheGroups entry that consolidates all extracted CSS back into app.css, preventing the split. JS chunking is unaffected. The production build config is unchanged.

LLM usage notice

Built with assistance from Claude.

Adds a cacheGroups entry that consolidates all extracted CSS back into
app.css, so HtmlWebpackPlugin's injected link tag resolves correctly.
Without it, splitChunks moves the CSS to a numbered chunk, leaving
app.css empty and causing a 404 on every dev server reload.

Co-Authored-By: Claude <noreply@anthropic.com>
@arbrandes
Copy link
Copy Markdown
Contributor Author

False alarm. This is not really necessary.

@arbrandes arbrandes closed this Apr 22, 2026
@arbrandes arbrandes deleted the fix-dev-chunk-optimization branch April 22, 2026 16:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant