@myelophone/nuxt 0.19.1 → 0.20.1

package/CHANGELOG.md

@@ -1,3 +1,14 @@
+## 📦 Release 0.20.1 (2026-09-23)
+### 🐛 Bug Fixes
+- update dependencies
+
+## 📦 Release 0.20.0 (2026-09-04)
+### ✨ Features
+- add ssr stream
+
+### 📚 Documentation
+- update readme
+
 ## 📦 Release 0.19.1 (2026-08-30)
 ### 🐛 Bug Fixes
 - update github actions

package/README.md

@@ -100,17 +100,17 @@ export default defineNuxtConfig({
 
 ### Extend it as a Nuxt layer
 
-The layer can be installed directly from GitHub without registry configuration, access tokens, or GitHub Packages authentication. Add the dependency to the consuming application's `package.json`:
+The layer is published on [npm](https://www.npmjs.com/package/@myelophone/nuxt). Add it to the consuming application's `package.json`:
 
 ```json
 {
  "devDependencies": {
-  "@myelophone/nuxt": "git+https://github.com/myelophone/nuxt.git"
+  "@myelophone/nuxt": "^0.19.1"
  }
 }
 ```
 
-Install dependencies and prepare Nuxt types:
+Install dependencies from npm and prepare Nuxt types:
 
 ```bash
 yarn install
@@ -542,7 +542,7 @@ const props = withDefaults(
 
 const english: ProductPageContent = {
  seo: {
-  title: "Acme — a clearer way to work",
+  title: "Acme - a clearer way to work",
   description: "A short description of the complete product page.",
  },
  brand: "Acme",
@@ -558,7 +558,7 @@ const defaultContentByLocale: Record<string, ProductPageContent> = {
  en: english,
  pl: mergeReadyContent(english, {
   seo: {
-   title: "Acme — prostszy sposób pracy",
+   title: "Acme - prostszy sposób pracy",
    description: "Krótki opis kompletnej strony produktu.",
   },
   hero: {
@@ -995,7 +995,7 @@ Use `SeoProfileInfo` only when the page primarily describes one person or organi
 <SeoProfileInfo
  id="https://example.com/team/ada#profile-page"
  url="https://example.com/team/ada"
- name="Ada Lovelace — profile"
+ name="Ada Lovelace - profile"
  date-created="2024-01-10T09:00:00Z"
  date-modified="2026-08-16T12:00:00Z"
  entity-id="https://example.com/team/ada#person"
@@ -2977,7 +2977,7 @@ Commits follow Conventional Commits and are checked with Commitlint. The `main`
 - `BREAKING CHANGE:` → major release;
 - documentation, tests, refactors, build, CI, style, and chores do not release by default.
 
-The release workflow updates `CHANGELOG.md` and `package.json`, publishes to GitHub Packages, creates a GitHub release, and commits release metadata back to the repository.
+The release workflow updates `CHANGELOG.md` and `package.json`, publishes to [npm](https://www.npmjs.com/package/@myelophone/nuxt) with provenance, creates a GitHub release, and commits release metadata back to the repository.
 
 ### Compatibility checklist
 

package/app/app.vue

@@ -354,7 +354,7 @@ useCommand({
 	<NuxtLayout>
 		<NuxtErrorBoundary>
 			<main id="main" tabindex="-1">
-				<NuxtPage :keepalive="{ max: 10 }" />
+				<NuxtPage />
 			</main>
 			<template #error="{ error, clearError }">
 				<SeoNoIndex :status-code="error?.statusCode" />

package/app/components/view/NotFound.vue

@@ -59,8 +59,8 @@ onUnmounted(deactivateNotFound);
 const { t } = useMultiLang(["interface"]);
 
 useAppSeo({
-	title: () => `404 — ${t("interface.pageNotFound")}`,
-	description: () => `404 — ${t("interface.pageNotFoundDescription")}`,
+	title: () => `404 - ${t("interface.pageNotFound")}`,
+	description: () => `404 - ${t("interface.pageNotFoundDescription")}`,
 	noIndex: true,
 });
 </script>

package/app/composables/useMultiLang.ts

@@ -174,6 +174,14 @@ export function useMultiLang(namespaces: string | string[]) {
 		{ watch: [activeLang] },
 	);
 
+	if (import.meta.client) {
+		onMounted(() => {
+			void Promise.all(
+				nsArray.map((ns) => loadNamespace(activeLang.value, ns)),
+			);
+		});
+	}
+
 	const t = (
 		key: string,
 		arg1?: InterpolationParams | number,

package/app/middleware/blog-layout.ts

@@ -21,7 +21,9 @@ export default defineNuxtRouteMiddleware(async (to) => {
 	if (!post) {
 		const event = useRequestEvent();
 
-		if (event) {
+		const isIslandRequest = Boolean(useNuxtApp().ssrContext?.islandContext);
+
+		if (event && !isIslandRequest) {
 			setResponseStatus(event, 404, 'Not Found');
 		}
 	}

package/app/modules/default-blog/index.ts

@@ -20,7 +20,7 @@ function processPages(pages: NuxtPage[], blogEnabled: boolean) {
 	for (let i = pages.length - 1; i >= 0; i--) {
 		const page = pages[i]!;
 
-		if (page.file?.endsWith('/post/[...slug].vue')) {
+		if (page.file?.endsWith('/post/[...slug].server.vue')) {
 			if (!blogEnabled) {
 				pages.splice(i, 1);
 				continue;

package/app/modules/myelophone-config/module.ts

@@ -33,6 +33,52 @@ const enableDefaultRouteStreaming = (routeRules: Record<string, any>) => {
 	};
 };
 
+const disablePostRouteStreaming = (
+	routeRules: Record<string, any>,
+	locales: string[],
+) => {
+	const postRoutes = new Set([
+		'/post/**',
+		...locales.map((locale) => `/${locale}/post/**`),
+	]);
+
+	for (const route of postRoutes) {
+		routeRules[route] = {
+			...(routeRules[route] && typeof routeRules[route] === 'object'
+				? routeRules[route]
+				: {}),
+			streaming: false,
+		};
+	}
+};
+
+const addSWRPayloadRoutes = (routeRules: Record<string, any>) => {
+	for (const [route, rule] of Object.entries(routeRules)) {
+		if (!rule || typeof rule !== 'object' || rule.swr === false) {
+			continue;
+		}
+
+		if ('swr' in rule) {
+			const payloadRoute = `${route === '/' ? '' : route.replace(/\/$/, '')}/_payload.json`;
+			const current = routeRules[payloadRoute];
+			const cache =
+				rule.cache && typeof rule.cache === 'object'
+					? rule.cache
+					: {
+							swr: true,
+							...(typeof rule.swr === 'number'
+								? { maxAge: rule.swr }
+								: {}),
+						};
+
+			routeRules[payloadRoute] = {
+				...(current && typeof current === 'object' ? current : {}),
+				cache,
+			};
+		}
+	}
+};
+
 const defaultCookieScripts = {
 	necessary: [],
 	analytics: [],
@@ -179,6 +225,10 @@ export default defineNuxtModule<MyelophoneConfig>({
 		if (isStreamingSSR) {
 			nuxt.options.routeRules ||= {};
 			enableDefaultRouteStreaming(nuxt.options.routeRules);
+			disablePostRouteStreaming(
+				nuxt.options.routeRules,
+				myelophone.multi18n.locales,
+			);
 		}
 
 		nuxt.hook('build:before', () => {
@@ -193,10 +243,15 @@ export default defineNuxtModule<MyelophoneConfig>({
 		nuxt.hook('nitro:config', (nitroConfig) => {
 			nitroConfig.runtimeConfig ||= {};
 			nitroConfig.runtimeConfig.myelophone = myelophone;
+			nitroConfig.routeRules ||= {};
+			addSWRPayloadRoutes(nitroConfig.routeRules);
 
 			if (isStreamingSSR) {
-				nitroConfig.routeRules ||= {};
 				enableDefaultRouteStreaming(nitroConfig.routeRules);
+				disablePostRouteStreaming(
+					nitroConfig.routeRules,
+					myelophone.multi18n.locales,
+				);
 			}
 		});
 

package/app/pages/post/[...slug].server.vue

@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import { getPost } from "#myelophone/app/utils/blog.server";
+
+const route = useRoute();
+const param = "slug" in route.params ? route.params.slug : undefined;
+const slug = Array.isArray(param) ? param.join("/") : (param ?? "");
+const post = await getPost(slug);
+
+if (!post) {
+	const event = useRequestEvent();
+	const isIslandRequest = Boolean(useNuxtApp().ssrContext?.islandContext);
+
+	if (event && !isIslandRequest) {
+		setResponseStatus(event, 404, "Not Found");
+	}
+} else {
+	useAppSeo({
+		title: post.meta.title,
+		description: post.meta.description,
+		image: post.meta.image,
+	});
+}
+
+const html = post?.html ?? "";
+</script>
+
+<template>
+	<div class="post-content-page">
+		<ViewNotFound v-if="!post" :set-response-status="false" />
+		<article v-else class="post-content" v-html="html" />
+	</div>
+</template>

package/app/plugins/open-graph-only.ts

@@ -0,0 +1,36 @@
+export default defineNuxtPlugin(() => {
+	const head = injectHead();
+
+	if (!head) return;
+	const hooks = head.hooks;
+
+	if (!hooks) return;
+
+	hooks.hook('entries:normalize', ({ tags }) => {
+		for (let index = tags.length - 1; index >= 0; index--) {
+			const tag = tags[index];
+			if (!tag) continue;
+
+			if (
+				tag.tag === 'meta' &&
+				tag.props.name?.toLowerCase() === 'twitter:card'
+			) {
+				tags.splice(index, 1);
+			}
+		}
+	});
+
+	hooks.hook('tags:beforeResolve', ({ tags }) => {
+		for (let index = tags.length - 1; index >= 0; index--) {
+			const tag = tags[index];
+			if (!tag) continue;
+
+			if (
+				tag.tag === 'meta' &&
+				tag.props.name?.toLowerCase() === 'twitter:card'
+			) {
+				tags.splice(index, 1);
+			}
+		}
+	});
+});

package/app/plugins/url-helper.client.ts

@@ -2,7 +2,6 @@ import { type Pinia } from 'pinia';
 
 export default defineNuxtPlugin((nuxtApp) => {
 	const router = useRouter();
-
 	const pinia = useNuxtApp().$pinia as Pinia;
 	const settingsStore = useSettingsStore(pinia);
 

package/app/server/middleware/security-headers.ts

@@ -112,6 +112,11 @@ export default defineEventHandler((event) => {
 
 	for (const [rawKey, rawValue] of Object.entries(rules.headers)) {
 		const key = rawKey as SecurityHeaderKey;
+
+		if (key === 'contentSecurityPolicy') {
+			continue;
+		}
+
 		const headerName =
 			key === 'contentSecurityPolicy' &&
 			rules.contentSecurityPolicyReportOnly

package/app/server/middleware/url-helper.ts

@@ -9,6 +9,13 @@ export default defineEventHandler((event) => {
 		`http://${event.node.req.headers.host}`,
 	);
 
+	if (
+		url.pathname.startsWith('/_nuxt/') ||
+		url.pathname.startsWith('/__nuxt_')
+	) {
+		return;
+	}
+
 	const sanitize = (path: string) => {
 		let p = path
 			.replace(/[<>{}|\\^`]/g, '')

package/app/types/blog-content.d.ts

@@ -0,0 +1,11 @@
+declare module 'virtual:myelophone-blog-content' {
+	const posts: Record<
+		string,
+		{
+			meta: Record<string, string>;
+			html: string;
+		}
+	>;
+
+	export { posts };
+}

package/app/utils/blog.server.ts

@@ -1,5 +1,4 @@
-import { parse } from 'yaml';
-import MarkdownIt from 'markdown-it';
+import { posts as generatedPosts } from 'virtual:myelophone-blog-content';
 
 export interface PostMeta {
 	title?: string;
@@ -8,135 +7,10 @@ export interface PostMeta {
 }
 
 export interface Post {
-	content: string;
 	meta: PostMeta;
-}
-
-type PostLoader = () => Promise<string>;
-
-const postCache = new Map<string, Promise<Post>>();
-const markdown = new MarkdownIt({
-	html: false,
-	linkify: true,
-	typographer: true,
-});
-const blockTagPattern =
-	/(<\/?(?:address|article|aside|blockquote|div|dl|dt|dd|fieldset|figcaption|figure|footer|form|h[1-6]|header|hr|li|main|nav|ol|p|section|table|tbody|td|tfoot|th|thead|tr|ul)\b[^>]*>)\s+(?=<\/?(?:address|article|aside|blockquote|div|dl|dt|dd|fieldset|figcaption|figure|footer|form|h[1-6]|header|hr|li|main|nav|ol|p|section|table|tbody|td|tfoot|th|thead|tr|ul)\b)/gi;
-
-function normalizePosts(
-	items: Record<string, PostLoader>,
-): Record<string, PostLoader> {
-	return Object.fromEntries(
-		Object.entries(items).flatMap(([path, loader]) => {
-			const normalized = path.replace(/\\/g, '/');
-
-			const marker = '/content/';
-			const index = normalized.lastIndexOf(marker);
-			if (index === -1) {
-				return [];
-			}
-
-			const slug = normalized
-				.slice(index + marker.length)
-				.replace(/\.md$/, '');
-
-			return [[slug, loader]];
-		}),
-	);
-}
-
-const postsAlias = import.meta.glob<string>('#myelophone/app/content/**/*.md', {
-	query: '?raw',
-	import: 'default',
-});
-
-const postsApp = import.meta.glob<string>('~/content/**/*.md', {
-	query: '?raw',
-	import: 'default',
-});
-
-const posts = {
-	...normalizePosts(postsAlias),
-	...normalizePosts(postsApp),
-};
-
-function parseMarkdown(source: string): Post {
-	if (!source.startsWith('---')) {
-		return {
-			meta: {},
-			content: source,
-		};
-	}
-
-	const match = source.match(/^---\r?\n([\s\S]*?)\r?\n---\r?\n?/);
-
-	if (!match) {
-		return {
-			meta: {},
-			content: source,
-		};
-	}
-
-	return {
-		meta: parsePostMeta(parse(match[1] ?? '')),
-		content: source.slice(match[0].length),
-	};
-}
-
-function parsePostMeta(value: unknown): PostMeta {
-	if (!value || typeof value !== 'object' || Array.isArray(value)) {
-		return {};
-	}
-
-	const source = value as Record<string, unknown>;
-	const meta: PostMeta = {};
-
-	for (const key of ['title', 'description', 'image'] as const) {
-		if (typeof source[key] === 'string') {
-			meta[key] = source[key];
-		}
-	}
-
-	return meta;
-}
-
-export function renderMarkdown(source: string): string {
-	return markdown
-		.render(source)
-		.split(/(<pre\b[\s\S]*?<\/pre>)/gi)
-		.map((fragment, index) => {
-			if (index % 2 === 1) {
-				return fragment;
-			}
-
-			return fragment
-				.replace(/\s*\r?\n\s*/g, ' ')
-				.replace(blockTagPattern, '$1')
-				.trim();
-		})
-		.join('');
+	html: string;
 }
 
 export async function getPost(slug: string): Promise<Post | null> {
-	const loader = posts[slug];
-
-	if (!loader) {
-		return null;
-	}
-
-	const cached = postCache.get(slug);
-
-	if (cached) {
-		return cached;
-	}
-
-	const promise = loader().then(parseMarkdown);
-	postCache.set(slug, promise);
-
-	try {
-		return await promise;
-	} catch (error) {
-		postCache.delete(slug);
-		throw error;
-	}
+	return generatedPosts[slug] ?? null;
 }

package/biome.json

@@ -1,5 +1,5 @@
 {
-  "$schema": "https://biomejs.dev/schemas/2.5.11/schema.json",
+  "$schema": "https://biomejs.dev/schemas/2.5.14/schema.json",
   "assist": {
     "actions": {
       "source": {

package/nuxt.config.ts

@@ -10,6 +10,10 @@ import defaultBlog from './app/modules/default-blog';
 import defaultSitemap from './app/modules/default-sitemap';
 
 import { cleanEmptyCssPlugin } from './vite/plugins/clean-css';
+import {
+	blogContentPlugin,
+	defaultBlogContentDirectories,
+} from './vite/plugins/blog-content';
 import postcssViewportFallback from './vite/plugins/postcss-viewport-fallback';
 import noImportant from 'postcss-no-important';
 import postcssAddViewportUnits from './vite/plugins/postcss-add-viewportunits';
@@ -24,7 +28,7 @@ const pkg = JSON.parse(
 
 const version = pkg.version;
 
-const dateActuality = '2026-08-31';
+const dateActuality = '2026-09-23';
 const banner = `/* © 2025 Aliaksandr Ivanou (https://aleksivanov.me/). All rights reserved. @MyelophOne/Nuxt v${version}. This app bundle licenses: /_nuxt/licenses.md */\n`;
 const defaultSeo = {
 	title: 'Our Nuxt WebSite | by MyelophOne/Nuxt',
@@ -131,6 +135,10 @@ export default defineNuxtConfig({
 	appConfig: {
 		defaultSeo,
 	},
+	seo: {
+		automaticTwitterTags: false,
+		automaticDefaults: false,
+	},
 	ogImage: {
 		enabled: process.env.NODE_ENV !== 'test',
 		zeroRuntime: true,
@@ -184,6 +192,12 @@ export default defineNuxtConfig({
 		},
 		plugins: [
 			tailwindcss(),
+			blogContentPlugin(
+				defaultBlogContentDirectories(
+					process.cwd(),
+					path.dirname(fileURLToPath(import.meta.url)),
+				),
+			),
 			{
 				name: 'suppress-plugin-timings-warning',
 				configResolved(config) {
@@ -324,7 +338,7 @@ export default defineNuxtConfig({
 			throwError: true,
 		},
 		rateLimiter: {
-			tokensPerInterval: 150,
+			tokensPerInterval: 300,
 			interval: 300000,
 			headers: true,
 			driver: {
@@ -406,9 +420,6 @@ export default defineNuxtConfig({
 		},
 		'/_ipx/**': { swr: false },
 	},
-	seo: {
-		automaticDefaults: false,
-	},
 	multi18n: {
 		locales: ['en'],
 		defaultLocale: 'en',
@@ -422,29 +433,49 @@ export default defineNuxtConfig({
 	},
 	hooks: {
 		'nitro:config'(nitroConfig) {
-			if (process.platform !== 'win32') {
-				return;
+			if (process.env.NUXT_PROFILE === '1') {
+				nitroConfig.plugins ||= [];
+				nitroConfig.plugins.push(
+					resolve('./vite/plugins/nitro-profile'),
+				);
 			}
 
 			nitroConfig.rollupConfig ||= {};
-			const resolver = {
-				name: 'resolve-nuxt-cache-driver-file-url',
-				resolveId(source: string) {
-					if (
-						source.startsWith('file:') &&
-						source.endsWith('/runtime/utils/cache-driver.mjs')
-					) {
-						return fileURLToPath(source);
-					}
-				},
-			};
-			const plugins = nitroConfig.rollupConfig.plugins;
+			const plugins = [
+				blogContentPlugin(
+					defaultBlogContentDirectories(
+						process.cwd(),
+						path.dirname(fileURLToPath(import.meta.url)),
+					),
+				),
+			];
+
+			if (process.platform === 'win32') {
+				plugins.push({
+					name: 'resolve-nuxt-cache-driver-file-url',
+					resolveId(source: string) {
+						if (
+							source.startsWith('file:') &&
+							source.endsWith('/runtime/utils/cache-driver.mjs')
+						) {
+							return fileURLToPath(source);
+						}
+					},
+				});
+			}
 
-			nitroConfig.rollupConfig.plugins = plugins
-				? Array.isArray(plugins)
-					? [...plugins, resolver]
-					: [plugins, resolver]
-				: [resolver];
+			const currentPlugins = nitroConfig.rollupConfig.plugins;
+			const mergedPlugins = [
+				...(Array.isArray(currentPlugins)
+					? currentPlugins
+					: currentPlugins
+						? [currentPlugins]
+						: []),
+				...plugins,
+			];
+			nitroConfig.rollupConfig.plugins = mergedPlugins as NonNullable<
+				typeof nitroConfig.rollupConfig.plugins
+			>;
 		},
 		'build:manifest': (manifest) => {
 			for (const key in manifest) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myelophone/nuxt",
-  "version": "0.19.1",
+  "version": "0.20.1",
   "type": "module",
   "author": "Aliaksandr Ivanou <aleksivanov.me@gmail.com> (https://github.com/aleksivanou)",
   "maintainers": [
@@ -17,6 +17,8 @@
     "generate": "NODE_OPTIONS='--no-webstorage' NUXT_TELEMETRY_DEBUG=1 NODE_ENV=production NUXT_STATIC=true NUXT_PLAYGROUND=true nuxt generate playground",
     "preview": "NODE_OPTIONS='--no-webstorage' NUXT_TELEMETRY_DEBUG=1 NUXT_PLAYGROUND=true nuxt preview playground",
     "server": "node --no-deprecation --no-warnings --no-webstorage playground/.output/server/index.mjs",
+    "static": "npx serve playground/.output/public",
+    "profile": "NODE_OPTIONS='--no-deprecation --no-webstorage' NUXT_TELEMETRY_DEBUG=1 NODE_ENV=production NUXT_PLAYGROUND=true NUXT_PROFILE=1 nuxt build playground",
     "prepare": "nuxt prepare && nuxt prepare playground",
     "analyze": "NODE_OPTIONS='--no-deprecation --no-webstorage' yarn nuxi analyze playground",
     "test": "yarn test:types && yarn playwright",
@@ -34,58 +36,58 @@
     "lock-update": "yarn dedupe --strategy highest"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.5.11",
-    "@commitlint/cli": "^21.2.2",
-    "@commitlint/config-conventional": "^21.2.2",
+    "@biomejs/biome": "^2.5.14",
+    "@commitlint/cli": "^21.2.3",
+    "@commitlint/config-conventional": "^21.2.3",
     "@nuxt/fonts": "^0.14.0",
     "@nuxt/image": "^2.1.0",
     "@nuxt/schema": "^4.5.2",
-    "@nuxt/scripts": "^1.3.8",
+    "@nuxt/scripts": "^1.3.9",
     "@nuxt/types": "^2.18.1",
     "@nuxtjs/fontaine": "^0.5.0",
-    "@nuxtjs/robots": "^6.2.0",
-    "@pinia/colada": "^1.4.2",
-    "@pinia/colada-nuxt": "^1.0.2",
+    "@nuxtjs/robots": "^6.2.3",
+    "@pinia/colada": "^1.4.5",
+    "@pinia/colada-nuxt": "^1.2.0",
     "@pinia/nuxt": "^1.0.2",
-    "@playwright/test": "^1.62.1",
+    "@playwright/test": "^1.63.0",
     "@semantic-release/changelog": "^7.0.0",
     "@semantic-release/commit-analyzer": "^13.0.1",
     "@semantic-release/git": "^11.0.1",
-    "@semantic-release/github": "^12.0.9",
-    "@semantic-release/npm": "^13.1.5",
+    "@semantic-release/github": "^12.0.10",
+    "@semantic-release/npm": "^13.2.0",
     "@semantic-release/release-notes-generator": "^14.1.1",
     "@tailwindcss/vite": "^4.3.3",
-    "@types/node": "^26.4.0",
-    "@unhead/vue": "^3.4.0",
+    "@types/node": "^26.6.2",
+    "@unhead/vue": "^3.4.1",
     "@vue/devtools-api": "^8.2.1",
-    "@vueuse/core": "^14.4.0",
-    "commitlint": "^21.2.2",
+    "@vueuse/core": "^15.0.0",
+    "commitlint": "^21.2.3",
     "conventional-changelog-conventionalcommits": "^10.4.0",
-    "markdown-it": "^15.0.1",
+    "markdown-it": "^15.0.2",
     "nuxt": "^4.5.2",
-    "nuxt-api-party": "^4.0.0",
+    "nuxt-api-party": "^4.0.1",
     "nuxt-link-checker": "^5.3.0",
-    "nuxt-og-image": "^6.7.8",
+    "nuxt-og-image": "^6.8.0",
     "nuxt-payload-analyzer": "^0.1.4",
     "nuxt-security": "^2.6.0",
-    "nuxt-seo-utils": "^8.4.3",
+    "nuxt-seo-utils": "^8.5.1",
     "nuxt-vitalizer": "^3.0.0",
     "pinia": "^4.0.3",
-    "postcss": "^8.5.26",
+    "postcss": "^8.5.28",
     "postcss-no-important": "^11.0.0",
     "purgecss": "^8.0.0",
-    "rolldown": "^1.2.6",
+    "rolldown": "^1.2.9",
     "semantic-release": "^25.0.9",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "unstorage": "^1.17.5",
-    "valibot": "^1.4.2",
-    "vite": "^8.2.2",
-    "vue": "^3.5.42",
+    "valibot": "^1.5.0",
+    "vite": "^8.3.0",
+    "vue": "^3.5.43",
     "vue-easy-lightbox": "^1.19.0",
     "vue-sonner": "^2.0.9",
     "vue-tsc": "^3.3.11",
-    "yaml": "^2.9.0"
+    "yaml": "^2.9.1"
   },
   "packageManager": "yarn@4.18.0",
   "repository": {

package/vite/plugins/blog-content.ts

@@ -0,0 +1,126 @@
+import { readdirSync, readFileSync } from 'node:fs';
+import { extname, join, relative, resolve } from 'node:path';
+import type { Plugin } from 'vite';
+import { parse } from 'yaml';
+import MarkdownIt, { type MarkdownIt as MarkdownItInstance } from 'markdown-it';
+
+const VIRTUAL_MODULE_ID = 'virtual:myelophone-blog-content';
+const RESOLVED_MODULE_ID = `\0${VIRTUAL_MODULE_ID}`;
+const blockTagPattern =
+	/(<\/?(?:address|article|aside|blockquote|div|dl|dt|dd|fieldset|figcaption|figure|footer|form|h[1-6]|header|hr|li|main|nav|ol|p|section|table|tbody|td|tfoot|th|thead|tr|ul)\b[^>]*>)\s+(?=<\/?(?:address|article|aside|blockquote|div|dl|dt|dd|fieldset|figcaption|figure|footer|form|h[1-6]|header|hr|li|main|nav|ol|p|section|table|tbody|td|tfoot|th|thead|tr|ul)\b)/gi;
+
+interface GeneratedPost {
+	meta: Record<string, string>;
+	html: string;
+}
+
+function collectMarkdownFiles(directory: string): string[] {
+	try {
+		return readdirSync(directory, { withFileTypes: true }).flatMap(
+			(entry) => {
+				const file = join(directory, entry.name);
+				return entry.isDirectory()
+					? collectMarkdownFiles(file)
+					: extname(file).toLowerCase() === '.md'
+						? [file]
+						: [];
+			},
+		);
+	} catch {
+		return [];
+	}
+}
+
+function renderMarkdown(source: string, markdown: MarkdownItInstance): string {
+	return markdown
+		.render(source)
+		.split(/(<pre\b[\s\S]*?<\/pre>)/gi)
+		.map((fragment: string, index: number) => {
+			if (index % 2 === 1) {
+				return fragment;
+			}
+
+			return fragment
+				.replace(/\s*\r?\n\s*/g, ' ')
+				.replace(blockTagPattern, '$1')
+				.trim();
+		})
+		.join('');
+}
+
+function parsePost(
+	source: string,
+	markdown: MarkdownItInstance,
+): GeneratedPost {
+	let meta: Record<string, string> = {};
+	let content = source;
+
+	if (source.startsWith('---')) {
+		const match = source.match(/^---\r?\n([\s\S]*?)\r?\n---\r?\n?/);
+
+		if (match) {
+			const parsed = parse(match[1] ?? '');
+			if (
+				parsed &&
+				typeof parsed === 'object' &&
+				!Array.isArray(parsed)
+			) {
+				for (const key of ['title', 'description', 'image']) {
+					const value = (parsed as Record<string, unknown>)[key];
+					if (typeof value === 'string') {
+						meta[key] = value;
+					}
+				}
+			}
+			content = source.slice(match[0].length);
+		}
+	}
+
+	return { meta, html: renderMarkdown(content, markdown) };
+}
+
+function generatePosts(directories: string[]): Record<string, GeneratedPost> {
+	const markdown = new MarkdownIt({
+		html: false,
+		linkify: true,
+		typographer: true,
+	});
+	const posts: Record<string, GeneratedPost> = {};
+
+	for (const directory of directories) {
+		for (const file of collectMarkdownFiles(directory)) {
+			const slug = relative(directory, file)
+				.replace(/\\/g, '/')
+				.replace(/\.md$/i, '');
+			posts[slug] = parsePost(readFileSync(file, 'utf8'), markdown);
+		}
+	}
+
+	return posts;
+}
+
+export function blogContentPlugin(directories: string[]): Plugin {
+	return {
+		name: 'myelophone-blog-content',
+		resolveId(id) {
+			return id === VIRTUAL_MODULE_ID ? RESOLVED_MODULE_ID : undefined;
+		},
+		load(id) {
+			if (id !== RESOLVED_MODULE_ID) {
+				return undefined;
+			}
+
+			return `export const posts = ${JSON.stringify(generatePosts(directories))};`;
+		},
+	};
+}
+
+export const defaultBlogContentDirectories = (
+	projectRoot: string,
+	packageRoot = projectRoot,
+) => [
+	resolve(packageRoot, 'app/content'),
+	resolve(projectRoot, 'app/content'),
+	resolve(projectRoot, 'content'),
+	resolve(projectRoot, 'playground/content'),
+];

package/vite/plugins/clean-css.ts

@@ -10,6 +10,21 @@ interface CleanCssPluginOptions {
 	purgeTailwindUtilities?: boolean;
 }
 
+function formatBytes(bytes: number): string {
+	if (bytes === 0) {
+		return '0 B';
+	}
+
+	const units = ['B', 'KB', 'MB', 'GB'];
+	const unitIndex = Math.min(
+		Math.floor(Math.log(bytes) / Math.log(1024)),
+		units.length - 1,
+	);
+	const value = bytes / 1024 ** unitIndex;
+
+	return `${parseFloat(value.toFixed(2))} ${units[unitIndex]}`;
+}
+
 export function cleanEmptyCssPlugin(
 	options: CleanCssPluginOptions = {},
 ): Plugin {
@@ -175,12 +190,16 @@ export function cleanEmptyCssPlugin(
 				}
 
 				await writeFile(file, css);
+				const sizeAfter = Buffer.byteLength(css, 'utf8');
 				reports.push(
-					`.../${basename(file)} (${sizeBefore} B → ${Buffer.byteLength(css, 'utf8')} B)`,
+					`.../${basename(file)} (${formatBytes(sizeBefore)} → ${formatBytes(sizeAfter)})`,
 				);
 			}
 		},
 		closeBundle() {
+			if (this.environment?.name !== 'client') {
+				return;
+			}
 			logger.info('Purging css...');
 			for (const report of reports) {
 				logger.info(report);

package/vite/plugins/nitro-profile.ts

@@ -0,0 +1,86 @@
+interface TimingState {
+	requestStart: number;
+	renderStart?: number;
+	renderEnd?: number;
+}
+
+export default defineNitroPlugin((nitroApp) => {
+	const timings = new WeakMap<object, TimingState>();
+
+	const getTiming = (event: { context: object }) =>
+		timings.get(event.context);
+
+	const writeTiming = (event: any) => {
+		const timing = getTiming(event);
+		if (!timing) {
+			return;
+		}
+
+		const now = performance.now();
+		const serverTiming: string[] = [];
+
+		if (timing.renderStart) {
+			serverTiming.push(
+				`nuxt-pre-render;dur=${(timing.renderStart - timing.requestStart).toFixed(2)}`,
+			);
+		}
+
+		if (timing.renderStart && timing.renderEnd) {
+			serverTiming.push(
+				`nuxt-render;dur=${(timing.renderEnd - timing.renderStart).toFixed(2)}`,
+			);
+		}
+
+		if (timing.renderEnd) {
+			serverTiming.push(
+				`nuxt-post-render;dur=${(now - timing.renderEnd).toFixed(2)}`,
+			);
+		}
+
+		const cache = event.context.cache;
+		if (cache) {
+			serverTiming.push(
+				`nuxt-cache;desc="${timing.renderStart ? 'miss' : 'hit'}"`,
+			);
+		}
+
+		serverTiming.push(
+			`nuxt-total;dur=${(now - timing.requestStart).toFixed(2)}`,
+		);
+
+		setResponseHeader(event, 'Server-Timing', serverTiming.join(', '));
+	};
+
+	nitroApp.hooks.hook('request', (event) => {
+		timings.set(event.context, { requestStart: performance.now() });
+
+		const response = event.node?.res;
+		if (!response) {
+			return;
+		}
+
+		const end = response.end.bind(response);
+		response.end = ((...args: Parameters<typeof response.end>) => {
+			writeTiming(event);
+			return end(...args);
+		}) as typeof response.end;
+	});
+
+	nitroApp.hooks.hook('render:before', ({ event }) => {
+		const timing = getTiming(event);
+		if (timing) {
+			timing.renderStart = performance.now();
+		}
+	});
+
+	nitroApp.hooks.hook('render:html', (_html, { event }) => {
+		const timing = getTiming(event);
+		if (timing) {
+			timing.renderEnd = performance.now();
+		}
+	});
+
+	nitroApp.hooks.hook('beforeResponse', (event) => {
+		writeTiming(event);
+	});
+});

package/app/components/ui/PostContent.server.vue

@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { getPost, renderMarkdown } from "#myelophone/app/utils/blog.server";
-
-const props = defineProps<{
-	slug: string;
-}>();
-
-const post = await getPost(props.slug);
-const html = post ? renderMarkdown(post.content) : "";
-
-if (post) {
-	useAppSeo({
-		title: post.meta.title,
-		description: post.meta.description,
-		image: post.meta.image,
-	});
-}
-</script>
-
-<template>
-	<ViewNotFound v-if="!post" :set-response-status="false" />
-	<article v-else class="post-content" v-html="html" />
-</template>

package/app/pages/post/[...slug].vue

@@ -1,30 +0,0 @@
-<script setup lang="ts">
-const route = useRoute();
-
-const param = "slug" in route.params ? route.params.slug : undefined;
-
-const slug = Array.isArray(param) ? param.join("/") : (param ?? "");
-
-if (import.meta.server) {
-	const { getPost } = await import("#myelophone/app/utils/blog.server");
-	const post = await getPost(slug);
-
-	if (!post) {
-		const event = useRequestEvent();
-
-		if (event) {
-			setResponseStatus(event, 404);
-		}
-	} else {
-		useAppSeo({
-			title: post.meta.title,
-			description: post.meta.description,
-			image: post.meta.image,
-		});
-	}
-}
-</script>
-
-<template>
-	<UiPostContent :slug="slug" />
-</template>