FlareStart
Google crawls without executing JavaScript. So every single page — /heic-to-jpg, /webp-to-png, /avif-to-jpg — returned identical empty HTML. Google saw them all as duplicates and indexed only the homepage. The fix: Next.js App Router + generateStaticParams I migrated to Next.js and used generateStaticParams() to pre-render all format pairs at build time: export async function generateStaticParams () { const formats = [ ' heic ' , ' jpg ' , ' jpeg ' , ' png ' , ' webp ' , ","image":"https://media2.dev.to/dynamic/image/width=1200,height=627,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F489r52rk1amy6vkueedn.png","datePublished":"2026-03-21T17:59:51","author":{"@type":"Person","name":"Serhii Kalyna"},"publisher":{"@type":"Organization","name":"Dev.to React"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://flarestart.com/article/how-i-fixed-google-ignoring-160-pages-migrating-from-vite-spa-to-nextjs-ssg-20260321"}}
Back to articles
How I fixed Google ignoring 160 pages: migrating from Vite SPA to Next.js SSG
How-ToWeb Development

How I fixed Google ignoring 160 pages: migrating from Vite SPA to Next.js SSG

via Dev.to ReactSerhii Kalyna

How I fixed Google ignoring 160 pages: migrating from Vite SPA to Next.js SSG I've been building Convertify — a free image converter that supports HEIC, WebP, AVIF, PNG, JPG and 20+ formats. The problem: after weeks of work, Google had indexed exactly 2 pages out of 160+. Why Google ignored my pages My app was a Vite React SPA. Every route looked like this in HTML: <!DOCTYPE html> <html> <head> <title> Convertify </title> </head> <body> <div id= "root" ></div> <script src= "/assets/index.js" ></script> </body> </html> Google crawls without executing JavaScript. So every single page — /heic-to-jpg, /webp-to-png, /avif-to-jpg — returned identical empty HTML. Google saw them all as duplicates and indexed only the homepage. The fix: Next.js App Router + generateStaticParams I migrated to Next.js and used generateStaticParams() to pre-render all format pairs at build time: export async function generateStaticParams () { const formats = [ ' heic ' , ' jpg ' , ' jpeg ' , ' png ' , ' webp ' ,

Continue reading on Dev.to React

Opens in a new tab

Read Full Article
2 views

Related Articles

Botanical garden
How-To

Botanical garden

Dev.to Tutorial • 5h ago

Task 3: Delivery Man Task
How-To

Task 3: Delivery Man Task

Dev.to • 5h ago

I Wasted Months Memorizing Design Patterns — This One Trick Changed Everything
How-To

I Wasted Months Memorizing Design Patterns — This One Trick Changed Everything

Medium Programming • 6h ago

Top 5 Games to Improve Your Coding Skills
How-To

Top 5 Games to Improve Your Coding Skills

Medium Programming • 6h ago

I Got a $40 Parking Fine, So I’m Building an App That Fixes It
How-To

I Got a $40 Parking Fine, So I’m Building an App That Fixes It

Medium Programming • 10h ago

Discover More Articles