Skip to content

Added new skipCss option#109

Closed
Prinzhorn wants to merge 1 commit intoEMH333:mainfrom
Prinzhorn:skip-css
Closed

Added new skipCss option#109
Prinzhorn wants to merge 1 commit intoEMH333:mainfrom
Prinzhorn:skip-css

Conversation

@Prinzhorn
Copy link
Copy Markdown
Contributor

@Prinzhorn Prinzhorn commented Feb 11, 2022

This is WIP (docs, tests) but I wanted to get your approval.

I've added Svelte support to Harp, my favorite static website generator (http://harpjs.com/, sintaxi/terraform#154)

There's one issue though: the generated static HTML (completely without JavaScript) is embedding the generated CSS. This works as expected. However, now if a component needs to be hydrated then the client side JS includes the CSS again (with css: true), which is entirely unnecessary. Using css: false does not work, because compilation happens entirely in-memory (using esbuild stdin). So even if we ignore the fact that I don't need CSS at all for the client bundle, it also wouldn't work because stdin cannot import the external CSS file. There's no filesystem.

So I need an option to compile a Svelte component without any CSS whatsoever.

@EMH333
Copy link
Copy Markdown
Owner

EMH333 commented Feb 17, 2022

I'm not set on the skipCSS name but this feature does make sense. I'm almost tempted to put it under compilerOptions as a difference from the vanilla Svelte options (css could be true, false, or "none" or something), though that would probably be more overhead than it is worth. I've been super busy these past few days but I will give it some more thought

@EMH333 EMH333 mentioned this pull request Feb 17, 2022
Closed
@Prinzhorn
Copy link
Copy Markdown
Contributor Author

Prinzhorn commented Feb 18, 2022

I'm almost tempted to put it under compilerOptions as a difference from the vanilla Svelte options (css could be true, false, or "none" or something),

Sounds good to me. This refs sveltejs/svelte#7270 then.

I've been super busy these past few days but I will give it some more thought

No worries

@Prinzhorn Prinzhorn mentioned this pull request Feb 18, 2022
Closed
@maxiruani maxiruani mentioned this pull request Sep 24, 2022
Closed
5 tasks
@Prinzhorn
Copy link
Copy Markdown
Contributor Author

Prinzhorn commented Sep 29, 2022

Svelte will get this soon, so I think this project needs to be adjusted for the new possible options as well? And the PR will likely become unnecessary.

sveltejs/svelte#7890

@EMH333
Copy link
Copy Markdown
Owner

EMH333 commented Sep 29, 2022

I've been tracking that PR, great to see some progress! And yeah, the Svelte PR will end up superseding this. I'll leave this open till it gets released though.

Yes, esbuild-svelte will need updates as people start migrating away from the boolean value. none and injected should work out of the box, but external won't. I'll do my best to track the Svelte release and follow up with the fix for this (I feel okay waiting for the official release before fixing it here given that the current version doesn't interfere with the added none feature).

@maxiruani maxiruani mentioned this pull request Oct 6, 2022
Merged
5 tasks
@EMH333 EMH333 mentioned this pull request Nov 10, 2022
Closed
@EMH333
Copy link
Copy Markdown
Owner

EMH333 commented Nov 10, 2022

Svelte released v3.53.0. Will follow up with esbuild-svelte release allowing for 'external' some time in the next week

EMH333 added a commit that referenced this pull request Nov 15, 2022
@EMH333
Support string values for css compiler option
fc4c7a4 
Fixes #150
Supersedes #109
@EMH333
Copy link
Copy Markdown
Owner

EMH333 commented Nov 15, 2022

Fixed in Svelte and released as esbuild-svelte v0.7.2

@EMH333 EMH333 closed this Nov 15, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@Prinzhorn @EMH333