import type { Plugin } from 'vite'; import fs from 'fs'; import path from 'path'; /** * Vite plugin that updates og:image and twitter:image meta tags * to point to the app's opengraph image with the correct Replit domain. */ export function metaImagesPlugin(): Plugin { return { name: 'vite-plugin-meta-images', transformIndexHtml(html) { const baseUrl = getDeploymentUrl(); if (!baseUrl) { log('[meta-images] no Replit deployment domain found, skipping meta tag updates'); return html; } // Check if opengraph image exists in public directory const publicDir = path.resolve(process.cwd(), 'client', 'public'); const opengraphPngPath = path.join(publicDir, 'opengraph.png'); const opengraphJpgPath = path.join(publicDir, 'opengraph.jpg'); const opengraphJpegPath = path.join(publicDir, 'opengraph.jpeg'); let imageExt: string | null = null; if (fs.existsSync(opengraphPngPath)) { imageExt = 'png'; } else if (fs.existsSync(opengraphJpgPath)) { imageExt = 'jpg'; } else if (fs.existsSync(opengraphJpegPath)) { imageExt = 'jpeg'; } if (!imageExt) { log('[meta-images] OpenGraph image not found, skipping meta tag updates'); return html; } const imageUrl = `${baseUrl}/opengraph.${imageExt}`; log('[meta-images] updating meta image tags to:', imageUrl); html = html.replace( //g, `` ); html = html.replace( //g, `` ); return html; }, }; } function getDeploymentUrl(): string | null { if (process.env.REPLIT_INTERNAL_APP_DOMAIN) { const url = `https://${process.env.REPLIT_INTERNAL_APP_DOMAIN}`; log('[meta-images] using internal app domain:', url); return url; } if (process.env.REPLIT_DEV_DOMAIN) { const url = `https://${process.env.REPLIT_DEV_DOMAIN}`; log('[meta-images] using dev domain:', url); return url; } return null; } function log(...args: any[]): void { if (process.env.NODE_ENV === 'production') { console.log(...args); } }