Suggestion - Complied CSS per component

jgthms / bulma

Modern CSS framework based on Flexbox

https://bulma.io

MIT License

49.14k stars 3.95k forks source link

Suggestion - Complied CSS per component #1202

Open ro-savage opened 7 years ago

ro-savage commented 7 years ago

I'd like to use Bulma in an app that doesn't use SASS/PostCSS but still get the benefits of importing the CSS for a single component.

Would it be possible to pre-build and publish component CSS that could then be imported as <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.5.2/css/grid/columns.css"> and import 'bulma/css/grid/columns.css'

bstashio commented 7 years ago

How about using Bulma Customizer?

ro-savage commented 7 years ago

I actually missed that. Thanks bstahio.

This is a good workaround but has several disadvantages

You don't get updates without using the customizer again
You need to know what components/feature you need before hand
~It is unclear to other developers why they have bulma but not all of bulma~~ Check config.json
~~If another developer wants to add new component, it's unclear what was in the previous customised version~~ Upload config.json
Doesn't allow for bundle splitting

bstashio commented 6 years ago

You're welcome @ro-savage.

I'm not sure I understand what you mean by point 2 and 5, can you please elaborate?

ro-savage commented 6 years ago

Point 2: If I use the customizer, then when I want a new component I have to build it again. If I could get the pre-complied css from NPM then I just import what I need, when I need it.

Point 5: Webpack and rollup allows bundle splitting based on routes. e.g. if I only use dropdown on the admin part of my webapp, it can be separated automatically and only downloaded by visitors who enter the admin area.

bstashio commented 6 years ago

Thanks for clarifying it.

chrisribe commented 6 years ago

Thanks @bstashio missed the Bluma Customizer link, wish I saw that sooner. Could the link or the project be referenced in the "Get Started" section ? Would help a lot.