https://github.com/lukesheard/esbuild-css-loader

CSS extraction and loading for esbuild
https://github.com/lukesheard/esbuild-css-loader

Last synced: 10 days ago
JSON representation

CSS extraction and loading for esbuild

• Host: GitHub
• URL: https://github.com/lukesheard/esbuild-css-loader
• Owner: LukeSheard
• License: mit
• Created: 2021-02-18T10:27:42.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2021-02-23T22:13:49.000Z (almost 4 years ago)
• Last Synced: 2024-10-06T03:42:46.026Z (3 months ago)
• Language: TypeScript
• Size: 10.7 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# esbuild-css-loader

CSS extraction and loading for esbuild. 

*(Based on ```css-loader``` and ```style-loader``` from webpack).*

Currently esbuild does not support CSS extraction with code-splitting. 

When building multiple entrypoints with esbuild a known workaround is to run

esbuild twice: once with code splitting on, once with it off. This generates large

blobs of CSS to load with each entrypoint but most of that CSS could be shared. 

This plugin extracts each imported CSS into it's own css file and loads it dynamically 

at runtime. 

## Known Caveats: 

* CSS which uses ```@import``` syntax is not supported since the CSS file is not AST parsed

and evaluated. This is fine in most cases since packages generally only ship full CSS files,

but may not work with local design systems. 

* Flashes of unstyled content are a thing (much like ```css-loader``` in webpack). This is 

because the CSS files are loaded inline during import evaluation.