Production build times out
malua opened this issue · 5 comments
malua commented
Astro Info
Astro v5.0.3
Node v20.17.0
System macOS (arm64)
Package Manager bun
Output static
Adapter none
Integrations astro-icon
@astrojs/sitemap
@astrojs/mdx
@astrojs/tailwind
@astrojs/markdoc
undici-retry
@astrojs/react
tina-cms
Describe the Bug
When running astro build the process times out every few runs. I have traced the issue inside render.js to bufferHeadContent. It seems to time out at await.value.init(result) when processing BaseLayout.astro.
value.INIT is still logged, but init + index not anymore. Maybe you can help me spot something in BaseLayout.astro what could lead to this time out?
THANK YOU, every hint is appreciated :)
The log corresponds to the console.log statements in pasted bufferHeadContent function.
Astro Build Log.log
bufferHeadContent
async function bufferHeadContent(result) {
const iterator = result._metadata.propagators.values();
console.log("RESULT")
console.log(result);
let index = 0;
while (true) {
console.log(index)
const { value, done } = iterator.next();
console.log(value)
if (done) {
console.log("done " + index);
break;
}
console.log("value.INIT")
console.log(value.init);
const returnValue = await value.init(result);
console.log("init " + index)
if (isHeadAndContent(returnValue)) {
result._metadata.extraHead.push(returnValue.head);
}
index++;
}
}
BaseLayout.astro
---
import Header from "@components/Header.astro";
import Footer from "@components/Footer.astro";
import "@fontsource-variable/overpass-mono";
import "@fontsource-variable/inconsolata";
import { getImage } from "astro:assets";
let baseUrl = new URL(Astro.request.url).origin;
import { ClientRouter } from "astro:transitions";
import CookieConsent from "../components/CookieConsent.astro";
const pageTitle = "blog";
const metaDescription = "meta descripttion";
const {
image,
description,
author,
pubDate,
updatedDate,
title,
site_name,
is404Page = false,
href,
alternateHref,
} = Astro.props;
const currentLocale = Astro.currentLocale;
---
<html
class="bg-[rgb(244,242,238)] dark:bg-[rgb(34,33,37)]"
lang={currentLocale}
>
<head>
<meta charset="utf-8" />
<link rel="sitemap" href="/sitemap-index.xml" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="generator" content={Astro.generator} />
<meta name="og:title" content={title || pageTitle} />
<meta name="og:description" content={description || metaDescription} />
<meta name="description" content={description || metaDescription} />
<meta property="og:type" content="website" />
<meta name="article:published_time" content={pubDate} />
<meta name="article:modified_time" content={updatedDate} />
<meta name="og:url" content={Astro.url} />
<meta name="twitter:card" content="summary_large_image" />
<meta property="twitter:domain" content={Astro.site} />
<meta property="twitter:url" content={Astro.url} />
<meta
name="twitter:card"
content={image || `${baseUrl}${metaImage?.src}`}
/>
<meta name="twitter:title" content={title || pageTitle} />
<meta name="twitter:description" content={description || metaDescription} />
<meta
name="twitter:image"
content={image || `${baseUrl}${metaImage?.src}`}
/>
<title>{pageTitle}</title>
<script
is:inline
src="https://www.googletagmanager.com/gtag/js?id=GTM-xxxxxx"></script>
<script>
declare global {
interface Window {
dataLayer: Record<string, any>[];
gtag: (...args: any[]) => void;
}
}
document.addEventListener("astro:page-load", () => {
window.dataLayer = window.dataLayer || [];
window.gtag = function gtag(...args: any[]) {
window.dataLayer.push(arguments);
};
window.gtag("js", new Date());
window.gtag("consent", "default", {
ad_storage: "denied",
ad_user_data: "denied",
ad_personalization: "denied",
analytics_storage: "denied",
});
window.gtag("config", "GTM-xxxxxxxx");
});
</script>
<script is:inline data-category="analytics">
function updateConsents() {
gtag("consent", "update", {
ad_storage: "granted",
ad_user_data: "granted",
ad_personalization: "granted",
analytics_storage: "granted",
});
}
</script>
<ClientRouter />
</head>
<body
class="flex flex-col flex-wrap md:pt-8 md:pr-16 md:pb-8 md:pl-16 p-8 max-w-full min-h-screen dark:bg-[rgb(34,33,37)] dark:text-[rgb(245,245,245)]"
>
<Header is404Page={is404Page} alternateHref={alternateHref} />
<div class="mt-8">
<slot />
</div>
<Footer alternateHref={alternateHref} />
<div transition:persist="find-me-on-the-other-side" id="cc-container">
<CookieConsent />
<script is:inline>
// Restore the `show--consent` class if it was present before the page swap
document.addEventListener("astro:before-preparation", (event) => {
const htmlClassName = window.document.documentElement.className;
const consentClassPresent = htmlClassName.includes("show--consent")
? true
: false;
window._showConsentClass = consentClassPresent;
});
document.addEventListener("astro:before-swap", (event) => {
const showConsent = window._showConsentClass ? ` show--consent` : "";
event.newDocument.documentElement.className += showConsent;
});
</script>
</div>
</body>
</html>
<style is:global>
.astro-code,
.astro-code span {
background-color: var(--shiki-light-bg) !important;
color: var(--shiki-light) !important;
font-style: var(--shiki-light-font-style) !important;
font-weight: var(--shiki-light-font-weight) !important;
text-decoration: var(--shiki-light-text-decoration) !important;
}
.dark .astro-code,
.dark .astro-code span {
background-color: var(--shiki-dark-bg) !important;
color: var(--shiki-dark) !important;
font-style: var(--shiki-dark-font-style) !important;
font-weight: var(--shiki-dark-font-weight) !important;
text-decoration: var(--shiki-dark-text-decoration) !important;
}
</style>
What's the expected result?
The build should complete every time.
Link to Minimal Reproducible Example
malua commented
I have added a reproduction repository. Just run bun/npm run build multiple times. It gets stuck every few times
matthewp commented
Can you reduce this down? Is Tailwind required for example? Remove everything until it stops breaking.
malua commented
I will do that in the coming days, thanks.