DEV Community

Cover image for Everything that breaks when you mirror a Webflow site (and the fixes)
Steve Smith
Steve Smith

Posted on • Originally published at stacktr.ee

Everything that breaks when you mirror a Webflow site (and the fixes)

Webflow's code export has two problems. It is only available on paid Workspace plans, and even when you pay, it does not include your CMS content: collection lists export as empty states, collection pages export with nothing in them. If your site has a blog, the export gives you a site without a blog. Forms and search are disabled in exported code too, per Webflow's own docs.

Meanwhile, the published site is sitting on a CDN, fully rendered. Every CMS page is real HTML. wget --mirror will happily fetch all of it.

What wget gives you, though, is not deployable. I migrated a production Webflow site this way and hit the same five breakages everyone hits, so I turned the fixes into a Claude Code skill that runs the whole workflow. This post is the five breakages, because they are useful whether or not you use the skill, and they apply to Framer, Squarespace, and friends with different domain names.

Setup: the mirror itself

The one wget incantation that matters, because Webflow serves assets from a separate CDN domain and you have to tell wget to follow it:

wget --mirror --convert-links --adjust-extension \
  --page-requisites --span-hosts \
  --domains=yourdomain.com,cdn.prod.website-files.com \
  --no-parent https://yourdomain.com/
Enter fullscreen mode Exit fullscreen mode

This downloads every page plus the CSS, JS, images, and fonts they reference, and rewrites URLs to relative paths. It looks complete. It is about 90% complete, and the missing 10% is invisible until the page renders blank.

Breakage 1: the page renders blank, console says "integrity"

The symptom: your mirrored page shows raw unstyled text or nothing at all, and the console says Failed to find a valid digest in the 'integrity' attribute.

The cause is subtle. Webflow ships its <link> and <script> tags with SHA-384 SRI hashes. wget's --convert-links rewrites URLs inside the downloaded CSS files, which changes their bytes, which means the SRI hash no longer matches, which means the browser silently refuses to apply the stylesheet. The file is right there. The browser will not touch it.

The fix is to strip the integrity attributes (and crossorigin, which travels with them):

sed -i '' -E 's/ integrity="[^"]*"//g; s/ crossorigin="[^"]*"//g' *.html
Enter fullscreen mode Exit fullscreen mode

This is the single most common cause of a "broken" migration, and no static file check will ever catch it, because every file exists and every reference resolves.

Breakage 2: the page still renders blank (webpack chunks)

Webflow's runtime is webpack-built and lazy-loads chunks named webflow.achunk.<hash>.js for sliders, animations, and interactions. wget never sees them, because they are loaded dynamically at runtime, not referenced in any HTML. When the entry bundle throws on the missing import, you get a blank page with a clean asset check. Again.

Each entry bundle embeds a chunk-id-to-hash map. Extract the hashes, fetch the chunks from the same CDN path, and drop them next to the entry bundles (webpack derives its public path from the entry script location, so no config needed). The skill does this with a small regex pass over the entry bundles; doing it by hand means searching for achunk in the runtime JS and pulling out the hash map object.

Breakage 3: zero-byte images with weird filenames

Webflow double-encodes special characters in CMS asset filenames. A file with a space ships as %2520 (the percent sign itself encoded), a plus as %252B, an ampersand as %2526. Decode once before fetching and the CDN 404s, and wget writes a zero-byte file without complaining.

Find them and re-fetch with the double-encoded URL:

find site/assets/images -empty -type f
Enter fullscreen mode Exit fullscreen mode

Breakage 4: missing hero images (inline background-image)

--page-requisites follows src and href attributes. It does not parse inline styles, so every background-image:url(...) asset, which on a typical Webflow marketing site includes the hero, is simply not downloaded. Grep the HTML for background-image:url( references to the CDN, extract, fetch. Bonus breakage inside the breakage: --convert-links mangles these same inline URLs into nested-quote garbage that needs its own sed pass.

Breakage 5: fonts 404 after you reorganize

Webflow's CSS references fonts as url(../font.ttf), assuming Webflow's directory layout. The moment you consolidate into a sane assets/css/, assets/js/, assets/images/ structure, that relative path points at the wrong directory. One regex pass over the CSS rewrites them.

The skill that runs all of this

I packaged the whole thing, mirror, consolidate, rewrite, the five fixes, an in-browser verification pass, and deploy, as an open-source Claude Code skill:

npx skills add stevysmith/website-builder-migrate-skill
Enter fullscreen mode Exit fullscreen mode

Then /website-builder-migrate https://yourdomain.com/ runs the seven-phase workflow. It is platform-agnostic with per-platform notes: Framer (React SPA, verify hydration), Squarespace (server-side image transforms), Carrd (trivial, single file), and Wix, which I will be honest about: heavily client-rendered Wix sites mirror badly, treat it as static-template-only.

Repo: https://github.com/stevysmith/website-builder-migrate-skill

Verify on a private URL before DNS moves

A migrated site needs checking against the original before anything public changes. Disclosure: I build Stacktree, which is the deploy target I added for exactly this step, because it is the only one that needs no account. The migrated folder publishes to a private, unguessable preview URL in one line:

(cd site && zip -qr ../site.zip .) && curl -F "file=@site.zip" https://api.stacktr.ee/sites
Enter fullscreen mode Exit fullscreen mode

That preview lives 24 hours, which is enough to click through every page next to the original. When it checks out, deploy wherever you like; the skill's docs cover Render, Netlify, and Vercel too, and keeping the Stacktree one is a free tier away.

What stays broken, on every path

Forms (they need Webflow's backend; swap in Formspree or Basin), native site search (Pagefind is the static-friendly answer), and live CMS updates (the mirror is a snapshot; re-run the skill when content changes). Worth repeating: Webflow's official paid export disables forms and search as well, and does not give you the CMS pages at all. The mirror is not a downgrade. For static sites it is the more complete copy.

If you hit a breakage not on this list, open an issue on the repo. The list grew to five by exactly that process.

Top comments (0)