Fix UI serving: replace runtime CDN Tailwind with build-time CSS#6
Merged
Fix UI serving: replace runtime CDN Tailwind with build-time CSS#6
Conversation
Co-authored-by: lmangani <1423657+lmangani@users.noreply.github.com>
Copilot
AI
changed the title
[WIP] Fix UI not being served correctly due to CSP issues
Fix UI serving: replace runtime CDN Tailwind with build-time CSS
Mar 7, 2026
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.
The Express server's strict
script-src 'self'CSP blocked the Tailwind CDN script and inline config, leaving the UI completely unstyled. A broken<link rel="stylesheet" href="/index.css">(file never existed) caused the SPA fallback to returnindex.htmlastext/css, triggering a MIME-type rejection.Changes
Tailwind: CDN → npm build-time
tailwindcss@^3,postcss,autoprefixeras devDependenciestailwind.config.ts— theme config extracted from the old inline<script>blockpostcss.config.js— wires Tailwind into Vite's PostCSS pipelineindex.css—@tailwinddirectives + all custom CSS moved out of the<style>block; imported inindex.tsxso Vite bundles itindex.html— stripped to minimal shellRemoved everything that was causing failures or was redundant after the Vite build:
<script src="https://cdn.tailwindcss.com">and inlinetailwind.configscript<style>block (→index.css)<script type="importmap">(unused — all deps are bundled by Vite)<link rel="stylesheet" href="/index.css">(now a real bundled asset)server/src/index.ts— CSP restored to strict; SPA fallback hardenedscriptSrcback to["'self'"]— no CDN allowances or'unsafe-inline'neededtext/htmlfor missing static assetsResult
Tailwind CSS is compiled into
dist/assets/index-*.css(~91 kB) at build time — no CDN dependency, no CSP violations, works behind adblockers and firewalls.🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.