Skip to content
This repository has been archived by the owner on Jan 11, 2023. It is now read-only.

FOUC (flash of unstyled content) when using sapper>0.28.0 #1531

Closed
martingraf4 opened this issue Sep 19, 2020 · 3 comments · Fixed by #1533
Closed

FOUC (flash of unstyled content) when using sapper>0.28.0 #1531

martingraf4 opened this issue Sep 19, 2020 · 3 comments · Fixed by #1533

Comments

@martingraf4
Copy link

Describe the bug
There is a flash of unstyled content when using sapper version 0.28.1 or later (setting emitCss: false).

To Reproduce

  1. Clone Sapper project template rollup npx degit "sveltejs/sapper-template#rollup" my-app
  2. Change package.json to install sapper version 0.28.1 "sapper": "0.28.1" (the error also occurs in 0.28.7, the current version at the time of this writing, but 0.28.1 is the earliest version I could find in which the error occurs)
  3. Install dependencies npm i
  4. Change rollup.config.js so that svelte does not emit css emitCss: false
  5. Run the template npm run dev
  6. Open chrome, enable developer options and look at the network tab
  7. Visit localhost:3000
  8. The first loaded page is not styled
    image

Rolling back to sapper version 0.28.0 solves this issue.
image

Expected behavior
The general layout of the page should not change after loading more resources / the first loaded page should contain inlined css.

Severity
Blocking an upgrade to sapper versions greater than 0.28.0

@njbotkin
Copy link

For my project (with emitCss: true), the issue appears to begin in 0.28.7.

@benmccann
Copy link
Member

@njbotkin your issue is a different one if you have emitCss: true. I found the issue with emitCss: false and have sent a PR to fix it. I have not seen any issues with emitCss: true. Can you file a new issue with a way to reproduce or share a sample site where this is happening or give more details of some sort?

@benmccann
Copy link
Member

@njbotkin 0.28.8 has been released with additional fixes. If you are still having an issue with the latest version please let me know and give me more details about how I can see the issue

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
3 participants