pleroma-like client for Bluesky pl.hexmani.ac
bluesky pleroma social-media

Fix static files not loading in production build

hexmani.ac 48ebeae3 47dc9eba

verified
+24 -16
+2 -2
index.html
··· 8 8 </head> 9 9 <body id="root"> 10 10 <noscript class="nojs"> 11 - <link rel="stylesheet" href="static/styles/nojs.css" /> 11 + <link rel="stylesheet" href="/styles/nojs.css" /> 12 12 <div class="container"> 13 13 <div class="container-header"> 14 14 <span>Bluroma</span> ··· 19 19 has blocked Bluroma from using JavaScript. Please enable 20 20 JavaScript to continue. 21 21 </p> 22 - <img src="static/favicon.png" alt="Bluroma logo" /> 22 + <img src="/favicon.png" alt="Bluroma Logo" /> 23 23 </div> 24 24 </noscript> 25 25 </body>
+2 -1
src/App.tsx
··· 1 1 import "./App.scss"; 2 2 3 3 import { Component } from "solid-js"; 4 + import logo from "/favicon.png?url"; 4 5 5 6 const App: Component = () => { 6 7 return ( 7 8 <> 8 - <img src="static/favicon.png" width="100" /> 9 + <img src={logo} width="100" /> 9 10 <h1>Bluroma</h1> 10 11 </> 11 12 );
+14 -9
static/styles/nojs.css
··· 26 26 background-color: rgba(15, 22, 30, 1); 27 27 border-radius: var(--radius); 28 28 margin: 1em; 29 - padding-bottom: 1rem; 29 + padding-bottom: 0.5rem; 30 30 max-height: 100%; 31 31 max-width: 350px; 32 32 box-shadow: 33 33 0px 0px 3px 0px rgba(0, 0, 0, 0.5), 34 34 0px 4px 6px 3px rgba(0, 0, 0, 0.3); 35 + 36 + h2, 37 + p { 38 + padding: 0 1rem; 39 + } 40 + 41 + img { 42 + height: 2.5rem; 43 + filter: grayscale(1); 44 + padding-bottom: 0.5rem; 45 + } 35 46 } 36 47 37 48 .container-header { 38 - font-weight: 500; 49 + font-weight: normal; 39 50 background-color: var(--foreground); 40 51 text-align: left; 41 52 padding: 1em; 42 53 height: 1rem; 43 54 border-radius: var(--radius) var(--radius) 0 0; 44 - margin-bottom: 1em; 55 + margin-bottom: 1rem; 45 56 box-shadow: 46 57 0px 1px 3px 0px rgba(0, 0, 0, 0.4), 47 58 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset; 48 - } 49 - 50 - img { 51 - margin-top: 0.5rem; 52 - max-width: 50px; 53 - filter: grayscale(1); 54 59 } 55 60 }
+6 -4
vite.config.ts
··· 1 - import { defineConfig } from 'vite'; 2 - import solidPlugin from 'vite-plugin-solid'; 3 - import devtools from 'solid-devtools/vite'; 1 + import { defineConfig } from "vite"; 2 + import solidPlugin from "vite-plugin-solid"; 3 + import devtools from "solid-devtools/vite"; 4 4 5 5 export default defineConfig({ 6 6 plugins: [devtools(), solidPlugin()], 7 7 server: { 8 8 port: 3000, 9 9 }, 10 + root: "./", 10 11 build: { 11 - target: 'esnext', 12 + target: "esnext", 12 13 }, 14 + publicDir: "static", 13 15 });