preact-cli icon indicating copy to clipboard operation
preact-cli copied to clipboard

Inline CSS for all publicURL not only /

Open Faisal-Manzer opened this issue 6 years ago • 6 comments

Do you want to request a feature or report a bug? Feature

What is the current behaviour? CLI Inlines all CSS when publicPath is / as mentioned by @prateekbh in #908

If the current behaviour is a bug, please provide the steps to reproduce. This is not a bug but can we have config change which Inlines CSS for all publicPath.

What is the expected behaviour? This is the expected behavior.

Faisal-Manzer avatar Jan 06 '20 15:01 Faisal-Manzer

I didnt get the issue sorry. Can you explain a bit more?

Are you getting non critical CSS for /?

e.g. Here's a demo: https://cli-demo-next.preactjs.com/

I see CSS for home page only when loading the homepage.

prateekbh avatar Jan 06 '20 17:01 prateekbh

When I changed config.output.publicPath to https://example.com/ I don't get inlined critical CSS.

➜ yarn build
yarn run v1.21.1
$ preact build --verbose --inline-css --no-sw --preload --prerenderUrls prerender-urls.js

PUBLIC_PATH is https://example.com

Build  [=================== ] 95% (4.6s) emitting
 ssr-bundle.8f1c3.css ⏤  3.53 kB (+3.53 kB)
        ssr-bundle.js ⏤  14 kB (+14 kB)

 Build  [=================== ] 95% (8.4s) emitting
       bundle.550c2.css ⏤  2.68 kB (+2.68 kB)
    bundle.*****.esm.js ⏤  17.6 kB (+17.6 kB)
 polyfills.*****.esm.js ⏤  2.03 kB (+2.03 kB)
   2.chunk.*****.esm.js ⏤  496 B (+496 B)
   3.chunk.*****.esm.js ⏤  266 B (+266 B)
       bundle.13d8b.css ⏤  2.64 kB (+2.64 kB)
       bundle.032a0.css ⏤  2.6 kB (+2.6 kB)
        bundle.d0746.js ⏤  17.7 kB (+17.7 kB)
     polyfills.782ee.js ⏤  2.03 kB (+2.03 kB)
       2.chunk.543b2.js ⏤  511 B (+511 B)
       3.chunk.12456.js ⏤  266 B (+266 B)

✨  Done in 52.78s.
But when config.output.publicPath is / I get critical CSS inlined.

➜ yarn build
yarn run v1.21.1
$ preact build --verbose --inline-css --no-sw --preload --prerenderUrls prerender-urls.js

PUBLIC_PATH is /

Build  [=================== ] 95% (4.7s) emitting
 ssr-bundle.8f1c3.css ⏤  3.53 kB (+3.53 kB)
        ssr-bundle.js ⏤  13.9 kB (+13.9 kB)

 Build  [=================== ] 95% (8.8s) emitting
       bundle.550c2.css ⏤  2.68 kB (+2.68 kB)
    bundle.*****.esm.js ⏤  17.6 kB (+17.6 kB)
 polyfills.*****.esm.js ⏤  2.02 kB (+2.02 kB)
   2.chunk.*****.esm.js ⏤  496 B (+496 B)
   3.chunk.*****.esm.js ⏤  266 B (+266 B)
       bundle.13d8b.css ⏤  2.64 kB (+2.64 kB)
       bundle.032a0.css ⏤  2.6 kB (+2.6 kB)
        bundle.8970b.js ⏤  17.6 kB (+17.6 kB)
     polyfills.abda0.js ⏤  2.01 kB (+2.01 kB)
       2.chunk.543b2.js ⏤  511 B (+511 B)
       3.chunk.12456.js ⏤  266 B (+266 B)

Critters: inlined 4.46 kB (51% of original 8.65 kB) of bundle.032a0.css.
Critters: inlined 4.46 kB (51% of original 8.65 kB) of bundle.032a0.css.
✨  Done in 24.82s.

Faisal-Manzer avatar Jan 06 '20 18:01 Faisal-Manzer

Can you share the repository link?

reznord avatar Jan 06 '20 18:01 reznord

I can share preact.config.js as my repo is private.

Faisal-Manzer avatar Jan 06 '20 18:01 Faisal-Manzer

https://gist.github.com/Faisal-Manzer/0ed735ad4a857a7b8dc60b5a84b1d0bd

Faisal-Manzer avatar Jan 06 '20 18:01 Faisal-Manzer

Any workaround for this?

Faisal-Manzer avatar Jan 23 '20 10:01 Faisal-Manzer

Can't reproduce, this looks to have been fixed at some point if it indeed was an issue.

rschristian avatar Jan 10 '23 18:01 rschristian