diff --git a/bun.lockb b/bun.lockb index 5dbf326..f08b9a5 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/index.html b/index.html deleted file mode 100644 index bff1342..0000000 --- a/index.html +++ /dev/null @@ -1,23 +0,0 @@ - - - - - - - - - flash.comma.ai - - -
- - - - diff --git a/package.json b/package.json index 067f6ce..a30e7ea 100644 --- a/package.json +++ b/package.json @@ -4,12 +4,10 @@ "private": true, "type": "module", "scripts": { - "dev": "node server", - "build": "npm run build:client && npm run build:server", - "build:client": "vite build --outDir dist/client", - "build:server": "vite build --outDir dist/server --ssr src/entry-server.jsx", - "serve": "NODE_ENV=production node server", - "start": "vite preview", + "dev": "vite", + "build": "vite build", + "generate": "vite build --outDir dist/static && npm run build:server && node prerender", + "start": "vite build && vite preview", "lint": "eslint . --ext js,jsx --report-unused-disable-directives", "test": "vitest" }, @@ -43,6 +41,8 @@ "postcss": "^8.4.38", "react-router-dom": "^6.24.1", "tailwindcss": "^3.4.3", + "vike": "^0.4.179", + "vike-react": "^0.4.17", "vite": "^5.2.12", "vite-plugin-ssr": "^0.4.142", "vite-plugin-style-import": "^2.0.0", diff --git a/src/app/favicon.ico b/public/favicon.ico similarity index 100% rename from src/app/favicon.ico rename to public/favicon.ico diff --git a/src/app/icon.png b/public/icon.png similarity index 100% rename from src/app/icon.png rename to public/icon.png diff --git a/src/app/icon.svg b/public/icon.svg similarity index 100% rename from src/app/icon.svg rename to public/icon.svg diff --git a/server.js b/server.js deleted file mode 100644 index e0b0a62..0000000 --- a/server.js +++ /dev/null @@ -1,53 +0,0 @@ -import fs from 'fs' -import path from 'path' -import { fileURLToPath } from 'url' -import express from 'express' -import { createServer as createViteServer } from 'vite' - -const __dirname = path.dirname(fileURLToPath(import.meta.url)) - -async function createServer() { - const app = express() - - const vite = await createViteServer({ - server: { middlewareMode: true }, - appType: 'custom' - }) - - app.use(vite.middlewares) - - app.use('*', async (req, res) => { - const url = req.originalUrl - - try { - let template = fs.readFileSync( - path.resolve(__dirname, 'index.html'), - 'utf-8' - ) - - const styleModule = await vite.ssrLoadModule('/src/index.css') - const css = styleModule.default - - template = await vite.transformIndexHtml(url, template) - template = template.replace( - '', - `` - ) - - const { render } = await vite.ssrLoadModule('/src/entry-server.jsx') - const appHtml = await render(url) - - let html = template.replace(``, appHtml) - - res.status(200).set({ 'Content-Type': 'text/html' }).end(html) - } catch (e) { - vite.ssrFixStacktrace(e) - console.error(e) - res.status(500).end(e.message) - } - }) - - app.listen(5173) -} - -createServer() diff --git a/src/app/Flash.client.jsx b/src/components/Flash.jsx similarity index 100% rename from src/app/Flash.client.jsx rename to src/components/Flash.jsx diff --git a/src/entry-client.jsx b/src/entry-client.jsx deleted file mode 100644 index 66ddb84..0000000 --- a/src/entry-client.jsx +++ /dev/null @@ -1,13 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './app/App' - -// import '@fontsource-variable/inter' -// import '@fontsource-variable/jetbrains-mono' - -ReactDOM.hydrateRoot( - document.getElementById('root'), - - - -) diff --git a/src/entry-server.jsx b/src/entry-server.jsx deleted file mode 100644 index ff903c3..0000000 --- a/src/entry-server.jsx +++ /dev/null @@ -1,15 +0,0 @@ -import './index.css' -import React from 'react' -import ReactDOMServer from 'react-dom/server' -import { StaticRouter } from 'react-router-dom/server' -import App from './app/App' - -export function render(url) { - return ReactDOMServer.renderToString( - - - - - - ) -} diff --git a/src/layouts/Head.jsx b/src/layouts/Head.jsx new file mode 100644 index 0000000..3396ef1 --- /dev/null +++ b/src/layouts/Head.jsx @@ -0,0 +1,20 @@ +import React from 'react' +import iconUrl from '../../public/icon.svg' + +export default function HeadDefault() { + return ( + <> + + + + + + ); +} diff --git a/src/layouts/Layout.jsx b/src/layouts/Layout.jsx new file mode 100644 index 0000000..7febf1b --- /dev/null +++ b/src/layouts/Layout.jsx @@ -0,0 +1,9 @@ +import '../index.css' + +import React from 'react' + +export default function Layout({ children }) { + return ( + {children} + ) +} diff --git a/src/pages/+config.js b/src/pages/+config.js new file mode 100644 index 0000000..5a49bba --- /dev/null +++ b/src/pages/+config.js @@ -0,0 +1,11 @@ +import vikeReact from 'vike-react/config' +import Head from '../layouts/Head' +import Layout from '../layouts/Layout' + +export default { + Head, + Layout, + title: "flash.comma.ai", + extends: vikeReact, +} + diff --git a/src/app/App.jsx b/src/pages/index/+Page.jsx similarity index 92% rename from src/app/App.jsx rename to src/pages/index/+Page.jsx index f62c5e9..c02e311 100644 --- a/src/app/App.jsx +++ b/src/pages/index/+Page.jsx @@ -1,15 +1,14 @@ -import { Suspense, lazy } from 'react' +import Flash from '../../components/Flash' -import comma from '../assets/comma.svg' -import fastbootPorts from '../assets/fastboot-ports.svg' -import zadigCreateNewDevice from '../assets/zadig_create_new_device.png' -import zadigForm from '../assets/zadig_form.png' +import comma from '../../assets/comma.svg' +import fastbootPorts from '../../assets/fastboot-ports.svg' +import zadigCreateNewDevice from '../../assets/zadig_create_new_device.png' +import zadigForm from '../../assets/zadig_form.png' -const Flash = lazy(() => import('./Flash.client')); export default function App() { - const version = import.meta.env.VITE_PUBLIC_GIT_SHA || 'dev' - console.info(`flash.comma.ai version: ${version}`); + const version = import.meta?.env?.VITE_PUBLIC_GIT_SHA ?? 'dev' + console.info(`flash.comma.ai version: ${version}`) return (
@@ -149,9 +148,7 @@ export default function App() {
- - - +
diff --git a/src/app/App.test.jsx b/src/pages/index/Page.test.jsx similarity index 100% rename from src/app/App.test.jsx rename to src/pages/index/Page.test.jsx diff --git a/src/utils/fastboot.js b/src/utils/fastboot.js index 5142b4b..5171e5c 100644 --- a/src/utils/fastboot.js +++ b/src/utils/fastboot.js @@ -103,7 +103,7 @@ export function useFastboot() { /** @type {React.RefObject} */ const manifest = useRef(null) - const initializePromise = useRef(null); + const initializePromise = useRef(null) function setMessage(message = '') { if (message) console.info('[fastboot]', message) diff --git a/vite.config.js b/vite.config.js index e379ad4..8d0a0c1 100644 --- a/vite.config.js +++ b/vite.config.js @@ -1,26 +1,19 @@ -import { fileURLToPath, URL } from 'node:url'; +import { fileURLToPath, URL } from 'node:url' import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' -import tailwindcss from 'tailwindcss' -import autoprefixer from 'autoprefixer' +import vike from 'vike/plugin' // https://vitejs.dev/config/ export default defineConfig({ plugins: [ react(), + vike({ + prerender: true, + }), ], - build: { - ssr: true, - rollupOptions: { - input: { - server: '/src/entry-server.jsx', - }, - }, - }, - css: { - postcss: { - plugins: [tailwindcss, autoprefixer], - }, + publicDir: 'public', + preview: { + port: 5173 }, resolve: { alias: [