kris/reacord
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

decentralize asset transformers

Browse Source
This commit is contained in:
MapleLeaf
2022-01-08 16:08:44 -06:00
parent b6c5c41706
commit 924da96c36
13 changed files with 293 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
packages/docs/src/main.tsx
View File

@@ -1,72 +1,38 @@
import compression from "compression"
import type { ErrorRequestHandler, Request, Response } from "express"
import type { ErrorRequestHandler, Request } from "express"
import express from "express"
import Router from "express-promise-router"
import PromiseRouter from "express-promise-router"
import httpTerminator from "http-terminator"
import pino from "pino"
import pinoHttp from "pino-http"
import * as React from "react"
import { renderToStaticMarkup } from "react-dom/server.js"
import ssrPrepass from "react-ssr-prepass"
import { AssetBuilderProvider } from "./asset-builder/asset-builder-context.js"
import { AssetBuilder } from "./asset-builder/asset-builder.js"
import { transformEsbuild } from "./asset-builder/transform-esbuild.js"
import { transformMarkdown } from "./asset-builder/transform-markdown.js"
import { transformPostCss } from "./asset-builder/transform-postcss.js"
import { fromProjectRoot } from "./constants"
import { GuidePage } from "./guides/guide-page"
import { renderMarkdownFile } from "./helpers/markdown"
import { Html } from "./html.js"
import { Landing } from "./landing/landing"
const logger = pino()
const port = process.env.PORT || 3000
const assets = await AssetBuilder.create(fromProjectRoot(".asset-cache"), [
transformEsbuild,
transformPostCss,
transformMarkdown,
])
async function render(res: Response, element: React.ReactElement) {
element = <React.Suspense fallback={<></>}>{element}</React.Suspense>
await ssrPrepass(element)
res.type("html").send(`<!DOCTYPE html>\n${renderToStaticMarkup(element)}`)
}
const builder = await AssetBuilder.create(fromProjectRoot(".asset-cache"))
const logger = pino()
const errorHandler: ErrorRequestHandler = (error, request, response, next) => {
response.status(500).send(error.message)
logger.error(error)
}
const router = Router()
const router = PromiseRouter()
.use(pinoHttp({ logger }))
.use(compression())
.use(assets.middleware())
.use(builder.middleware())
.get("/guides/*", async (req: Request<{ 0: string }>, res) => {
const { data } = await renderMarkdownFile(
new URL(`guides/${req.params[0]}.md`, import.meta.url).pathname,
)
await render(
res,
<AssetBuilderProvider value={assets}>
<Html title={`${data.title} | Reacord`} description={data.description}>
<GuidePage url={req.params[0]} />
</Html>
</AssetBuilderProvider>,
)
res
.type("html")
.send(await builder.render(<GuidePage url={req.params[0]} />))
})
.get("/", async (req, res) => {
await render(
res,
<AssetBuilderProvider value={assets}>
<Html>
<Landing />
</Html>
</AssetBuilderProvider>,
)
res.type("html").send(await builder.render(<Landing />))
})
.use(errorHandler)