2 ms·

> The old way of doing CSS was crazy and unmanageable. That's a bit of a stretch though, we've had good success with using normal CSS files, included in each c

by gedy 10y ago

> The old way of doing CSS was crazy and unmanageable. That's a bit of a stretch though, we've had good success with using normal CSS files, included in each component with webpack CSS-loader[1]. CSS is displayed in head as needed, but without an all-JS approach like this [1] https://github.com/webpack/css-loader https://github.com/webpack/css-loader

tracker1 10y ago
For that matter, it's not so hard to setup sass-loader with custom default locations... I'll usually have my own copy of bootstrap's variables.scss, a mixins.scss that points to bootstrap's... from there, I have a copy of bootstrap.scss included higher up pointing to the local mixins/variables, and the rest from the node_modules/bootstrap(-sass)/ path... I can then, inside my component... require('./mycomponent-style.scss') .... <div class="mycomponent"> with the mycomponent-style.scss @import "variables"; @import "mixins"; .mycomponent { ... } And have all of bootstrap's variables/mixins to work with... I can update variables for those bits of bootstrap I want changed, components also update based on those values. It actually works really well, and it's not hard to setup. I should really write a current article on using Bootstrap@4 from source... There's a little bit of boilerplate, but so worth it. That said, I do appreciate the inline options, and feel that future React apps in particular should probably go in that direction. It really just depends on how you are working with.