Fix Electron production CSS not loading under file://.
Strip crossorigin from the built index so stylesheets apply in the packaged app, and use a relative manifest path for the same reason.
This commit is contained in:
@@ -32,7 +32,7 @@
|
|||||||
href="https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Space+Grotesk:wght@400;600;700&display=swap"
|
href="https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Space+Grotesk:wght@400;600;700&display=swap"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<link rel="manifest" href="/manifest.json" />
|
<link rel="manifest" href="./manifest.json" />
|
||||||
<meta name="mobile-web-app-capable" content="yes" />
|
<meta name="mobile-web-app-capable" content="yes" />
|
||||||
<meta name="application-name" content="Paarrot" />
|
<meta name="application-name" content="Paarrot" />
|
||||||
<meta name="apple-mobile-web-app-title" content="Paarrot" />
|
<meta name="apple-mobile-web-app-title" content="Paarrot" />
|
||||||
|
|||||||
@@ -6,8 +6,6 @@ import { MessageEmptyContent } from './content';
|
|||||||
import { sanitizeCustomHtml } from '../../utils/sanitize';
|
import { sanitizeCustomHtml } from '../../utils/sanitize';
|
||||||
import { highlightText, scaleSystemEmoji } from '../../plugins/react-custom-html-parser';
|
import { highlightText, scaleSystemEmoji } from '../../plugins/react-custom-html-parser';
|
||||||
import { isMxEmoticonOnlyHtml } from '../../utils/regex';
|
import { isMxEmoticonOnlyHtml } from '../../utils/regex';
|
||||||
// Ensure jumbo emoji global styles are always in the bundle.
|
|
||||||
import './layout/layout.css';
|
|
||||||
|
|
||||||
type RenderBodyProps = {
|
type RenderBodyProps = {
|
||||||
body: string;
|
body: string;
|
||||||
|
|||||||
@@ -136,6 +136,21 @@ function servePublicAssets() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// CORS proxy for Matrix homeservers during development
|
// CORS proxy for Matrix homeservers during development
|
||||||
|
/**
|
||||||
|
* Vite adds crossorigin to module/CSS tags when base is relative (./).
|
||||||
|
* Electron serves the build via file:// — those assets then fail CORS checks
|
||||||
|
* and the app renders with browser defaults (black text, broken spacing).
|
||||||
|
*/
|
||||||
|
function stripCrossoriginForFileProtocol() {
|
||||||
|
return {
|
||||||
|
name: 'strip-crossorigin-for-file-protocol',
|
||||||
|
apply: 'build',
|
||||||
|
transformIndexHtml(html) {
|
||||||
|
return html.replace(/\s+crossorigin/g, '');
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
function corsProxyMiddleware() {
|
function corsProxyMiddleware() {
|
||||||
return {
|
return {
|
||||||
name: 'vite-plugin-cors-proxy',
|
name: 'vite-plugin-cors-proxy',
|
||||||
@@ -228,6 +243,7 @@ export default defineConfig({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
|
stripCrossoriginForFileProtocol(),
|
||||||
corsProxyMiddleware(), // Add CORS proxy for development
|
corsProxyMiddleware(), // Add CORS proxy for development
|
||||||
serverMatrixSdkCryptoWasm('/node_modules/.vite/deps/pkg/matrix_sdk_crypto_wasm_bg.wasm'),
|
serverMatrixSdkCryptoWasm('/node_modules/.vite/deps/pkg/matrix_sdk_crypto_wasm_bg.wasm'),
|
||||||
serveGifWorker(),
|
serveGifWorker(),
|
||||||
|
|||||||
Reference in New Issue
Block a user