quartz-research-note/quartz/processors/emit.ts

157 lines
5.5 KiB
TypeScript
Raw Normal View History

import path from "path"
import fs from "fs"
2023-07-02 20:08:29 +00:00
import { GlobalConfiguration, QuartzConfig } from "../cfg"
import { PerfTimer } from "../perf"
2023-07-02 20:08:29 +00:00
import { ComponentResources, emitComponentResources, getComponentResources, getStaticResourcesFromPlugins } from "../plugins"
import { EmitCallback } from "../plugins/types"
import { ProcessedContent } from "../plugins/vfile"
2023-07-13 07:19:35 +00:00
import { FilePath, QUARTZ, slugifyFilePath } from "../path"
import { globbyStream } from "globby"
2023-07-02 20:08:29 +00:00
// @ts-ignore
import spaRouterScript from '../components/scripts/spa.inline'
// @ts-ignore
import plausibleScript from '../components/scripts/plausible.inline'
// @ts-ignore
import popoverScript from '../components/scripts/popover.inline'
import popoverStyle from '../components/styles/popover.scss'
import { StaticResources } from "../resources"
import { QuartzLogger } from "../log"
import { googleFontHref } from "../theme"
import { trace } from "../trace"
2023-07-02 20:08:29 +00:00
2023-07-22 23:06:36 +00:00
function addGlobalPageResources(cfg: GlobalConfiguration, reloadScript: boolean, staticResources: StaticResources, componentResources: ComponentResources) {
2023-07-02 20:08:29 +00:00
staticResources.css.push(googleFontHref(cfg.theme))
// popovers
if (cfg.enablePopovers) {
componentResources.afterDOMLoaded.push(popoverScript)
componentResources.css.push(popoverStyle)
}
if (cfg.analytics?.provider === "google") {
const tagId = cfg.analytics.tagId
staticResources.js.push({
src: `https://www.googletagmanager.com/gtag/js?id=${tagId}`,
contentType: 'external',
loadTime: 'afterDOMReady',
})
componentResources.afterDOMLoaded.push(`
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag(\`js\`, new Date());
gtag(\`config\`, \`${tagId}\`, { send_page_view: false });
document.addEventListener(\`nav\`, () => {
gtag(\`event\`, \`page_view\`, {
page_title: document.title,
page_location: location.href,
});
});`
)
} else if (cfg.analytics?.provider === "plausible") {
componentResources.afterDOMLoaded.push(plausibleScript)
}
// spa
if (cfg.enableSPA) {
componentResources.afterDOMLoaded.push(spaRouterScript)
} else {
componentResources.afterDOMLoaded.push(`
window.spaNavigate = (url, _) => window.location.assign(url)
const event = new CustomEvent("nav", { detail: { slug: document.body.dataset.slug } })
document.dispatchEvent(event)`
)
}
2023-07-22 23:06:36 +00:00
if (reloadScript) {
staticResources.js.push({
loadTime: "afterDOMReady",
contentType: "inline",
script: `
const socket = new WebSocket('ws://localhost:3001')
socket.addEventListener('message', () => document.location.reload())
`
})
}
2023-07-02 20:08:29 +00:00
}
2023-07-22 23:06:36 +00:00
export async function emitContent(contentFolder: string, output: string, cfg: QuartzConfig, content: ProcessedContent[], reloadScript: boolean, verbose: boolean) {
const perf = new PerfTimer()
const log = new QuartzLogger(verbose)
log.start(`Emitting output files`)
const emit: EmitCallback = async ({ slug, ext, content }) => {
2023-07-13 07:19:35 +00:00
const pathToPage = path.join(output, slug + ext) as FilePath
const dir = path.dirname(pathToPage)
await fs.promises.mkdir(dir, { recursive: true })
await fs.promises.writeFile(pathToPage, content)
return pathToPage
}
2023-07-02 20:08:29 +00:00
// initialize from plugins
2023-06-03 19:07:19 +00:00
const staticResources = getStaticResourcesFromPlugins(cfg.plugins)
2023-07-02 20:08:29 +00:00
// component specific scripts and styles
const componentResources = getComponentResources(cfg.plugins)
2023-07-02 20:08:29 +00:00
// important that this goes *after* component scripts
// as the "nav" event gets triggered here and we should make sure
// that everyone else had the chance to register a listener for it
2023-07-22 23:06:36 +00:00
addGlobalPageResources(cfg.configuration, reloadScript, staticResources, componentResources)
2023-07-02 20:08:29 +00:00
2023-07-22 23:06:36 +00:00
let emittedFiles = 0
2023-07-02 20:08:29 +00:00
const emittedResources = await emitComponentResources(cfg.configuration, componentResources, emit)
if (verbose) {
for (const file of emittedResources) {
2023-07-22 23:06:36 +00:00
emittedFiles += 1
2023-07-02 20:08:29 +00:00
console.log(`[emit:Resources] ${file}`)
}
}
// emitter plugins
for (const emitter of cfg.plugins.emitters) {
2023-06-04 17:37:43 +00:00
try {
2023-06-17 02:41:59 +00:00
const emitted = await emitter.emit(contentFolder, cfg.configuration, content, staticResources, emit)
2023-06-04 17:37:43 +00:00
emittedFiles += emitted.length
2023-06-04 17:37:43 +00:00
if (verbose) {
for (const file of emitted) {
console.log(`[emit:${emitter.name}] ${file}`)
}
}
2023-06-04 17:37:43 +00:00
} catch (err) {
trace(`Failed to emit from plugin \`${emitter.name}\``, err as Error)
2023-06-04 17:37:43 +00:00
process.exit(1)
}
}
const staticPath = path.join(QUARTZ, "static")
await fs.promises.cp(staticPath, path.join(output, "static"), { recursive: true })
2023-06-03 19:07:19 +00:00
if (verbose) {
2023-06-17 02:41:59 +00:00
console.log(`[emit:Static] ${path.join("static", "**")}`)
2023-06-03 19:07:19 +00:00
}
// glob all non MD/MDX/HTML files in content folder and copy it over
2023-06-17 02:41:59 +00:00
const assetsPath = path.join(output, "assets")
2023-07-13 07:19:35 +00:00
for await (const rawFp of globbyStream("**", {
2023-05-31 21:41:44 +00:00
ignore: ["**/*.md"],
cwd: contentFolder,
})) {
2023-07-13 07:19:35 +00:00
const fp = rawFp as FilePath
const ext = path.extname(fp)
const src = path.join(contentFolder, fp) as FilePath
const name = slugifyFilePath(fp as FilePath) + ext as FilePath
const dest = path.join(assetsPath, name) as FilePath
const dir = path.dirname(dest) as FilePath
await fs.promises.mkdir(dir, { recursive: true }) // ensure dir exists
await fs.promises.copyFile(src, dest)
emittedFiles += 1
if (verbose) {
2023-06-17 02:41:59 +00:00
console.log(`[emit:Assets] ${path.join("assets", name)}`)
}
}
log.success(`Emitted ${emittedFiles} files to \`${output}\` in ${perf.timeSince()}`)
}