question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

RFC: CSS extraction bundler plugin

See original GitHub issue

Compiles (it would be createElement though instead of jsx)

// component.tsx
<>
  <style>.a { font-size: 10px; }</style>
  <div class="a">...</div>
</>

To

// component.tsx
import './component.css';
<div class="a">...</div>
// component.css
.a { font-size: 10px; }
  • Css extraction and the like can be left in user land.
  • Need to be a bundler plugin (Webpack & Parcel)

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:2
  • Comments:5

github_iconTop GitHub Comments

2reactions
avindracommented, May 11, 2020

Webpack and rollup are supported in linaria. An investigation into more aggressive output has already begun. Recommend having a look, as the linaria folks have covered a lot of similar ground (there is also a styled api)

0reactions
itsdougescommented, Jun 3, 2020

Merging into #58

Read more comments on GitHub >

github_iconTop Results From Across the Web

RFC: CSS extraction #58 - atlassian-labs/compiled - GitHub
We'd write this plugin to parse ALL compiled components (from both @catlaskit and Gira , and really anywhere) so when Gira builds their...
Read more >
MiniCssExtractPlugin - webpack
webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable...
Read more >
Webpack: A Gentle Introduction to the Module Bundler - Auth0
In the code above, we have the extract-text-webpack-plugin . It extracts all the CSS code into /dist/bundle.css . Webpack roams the source ...
Read more >
Tweets with replies by Compiled (@compiledcss) / Twitter
Experimental style extraction now available for Webpack 5! Try it today. ✓ Extract styles from your app ✓ Extract styles from node modules...
Read more >
invalid options object. mini css extract plugin has been initialized ...
node_modules/mini-css-extract-plugin/dist/loader.js): ModuleBuildError: Module build ... Gemfile $ bundle exec rails webpacker:install $ yarn add css-loader ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found