return content in asset

This commit is contained in:
MapleLeaf
2022-01-08 14:55:03 -06:00
parent b118d8a653
commit 7379402e80
3 changed files with 16 additions and 20 deletions

View File

@@ -10,6 +10,7 @@ export type Asset = {
inputFile: string
outputFile: string
url: string
content: string
}
export type AssetTransformer = {
@@ -37,21 +38,16 @@ export class AssetBuilder {
async build(input: Promisable<string | URL>, name?: string): Promise<Asset> {
const inputFile = normalizeAsFilePath(await input)
const { content } = await this.transform(inputFile)
const transformResult = await this.transform(inputFile)
const hash = createHash("sha256")
.update(transformResult.content)
.digest("hex")
.slice(0, 8)
const hash = createHash("sha256").update(content).digest("hex").slice(0, 8)
const parsedInputFile = parse(inputFile)
const url = `/${name || parsedInputFile.name}.${hash}${parsedInputFile.ext}`
const outputFile = join(this.cacheFolder, url)
await ensureWrite(outputFile, content)
await ensureWrite(outputFile, transformResult.content)
return { inputFile, outputFile, url }
return { inputFile, outputFile, url, content }
}
middleware(): RequestHandler {

View File

@@ -29,7 +29,7 @@ function useAssetBuild(
throw state.promise
}
return state.asset.url
return state.asset
}
export function LocalFileAsset({
@@ -39,15 +39,15 @@ export function LocalFileAsset({
}: {
from: string | URL
as?: string
children: (url: string) => ReactNode
children: (url: Asset) => ReactNode
}) {
const inputFile = normalizeAsFilePath(from)
const url = useAssetBuild(inputFile, (builder) => {
const asset = useAssetBuild(inputFile, (builder) => {
return builder.build(inputFile, name)
})
return <>{children(url)}</>
return <>{children(asset)}</>
}
export function ModuleAsset({
@@ -57,14 +57,14 @@ export function ModuleAsset({
}: {
from: string
as?: string
children: (url: string) => ReactNode
children: (url: Asset) => ReactNode
}) {
const cacheKey = `node:${from}`
const url = useAssetBuild(cacheKey, async (builder) => {
const asset = useAssetBuild(cacheKey, async (builder) => {
const inputFile = await import.meta.resolve!(from)
return await builder.build(inputFile, name)
})
return <>{children(url)}</>
return <>{children(asset)}</>
}

View File

@@ -32,17 +32,17 @@ export function Html({
/>
<ModuleAsset from="tailwindcss/tailwind.css">
{(url) => <link rel="stylesheet" href={url} />}
{(asset) => <link rel="stylesheet" href={asset.url} />}
</ModuleAsset>
<LocalFileAsset from={new URL("ui/prism-theme.css", import.meta.url)}>
{(url) => <link rel="stylesheet" href={url} />}
{(asset) => <link rel="stylesheet" href={asset.url} />}
</LocalFileAsset>
<title>{title}</title>
<ModuleAsset from="alpinejs/dist/cdn.js" as="alpine">
{(url) => <script defer src={url} />}
{(asset) => <script defer src={asset.url} />}
</ModuleAsset>
</head>
<body>{children}</body>