Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Less/Sass #351

Closed
franleplant opened this issue Aug 4, 2016 · 14 comments
Closed

Less/Sass #351

franleplant opened this issue Aug 4, 2016 · 14 comments

Comments

@franleplant
Copy link

Hi guys! thank you for this project.

I hate being Captain Obvious here but what are the plans for Less Sass support? It seems like a pretty extreme action to eject my app just to get less or sass in it when they are pretty standard (less and sass would make this tool easier to sell to our bosses).

I understand that choosing either is against the core ideas but parameterizing the choice also is against the core ideas so we are running out of options.

When I prototyped something like create react app in my own, one of the things I thought of was to provide hooks to the webpack config to extend it with Less for example, is that something you would be interested in adding?

I might create some prototypes if we agree upon something since my employeer is pro oss contribution.

Thanks a lot
Fran

@vjeux
Copy link
Contributor

vjeux commented Aug 4, 2016

This issue has a lot of context around this question: #78

Thanks for offering your help but right now this is not something we want to support in this project. If you have a concrete example of why Less/Sass is useful in the context of a React app, please comment on that other issue, we'd love to know.

@vjeux vjeux closed this as completed Aug 4, 2016
@eliperelman
Copy link
Contributor

Modifying or extending the Webpack configuration without ejecting, for example to add Sass/Less loaders, is also not supported with that feature not being anticipated. I encourage you to check out the alternatives if you find the Sass/Less support is required for your project.

@gaearon
Copy link
Contributor

gaearon commented Aug 4, 2016

Also, while we don't intend to ship either tool in the default setup, please feel free to use them just like people have been using them for years: with a CLI.

https://twitter.com/soska/status/760964598451372032

@franleplant
Copy link
Author

franleplant commented Aug 4, 2016

Thanks @vjeux for the pointers and @gaearon that's actually a very good alternative.

Being all that said I think that your little project might finally make CSS in Javascript standard.
I love the library Radium and it's trivial to add it to a project running on create-react-app and arguably you could have the same benefits (and even more), for example:

  • Shared variables
  • Scoped CSS (this is sort of modules)
  • Shared common chunks of css codes
  • Mixins et al (Plain JS functions 😮 )

BONUS: Write styles with exact CSS/LESS/SASS Syntax with this package
So I think I might be working with that.

NOTE: The details in this conversation might help others with the same inquiries as me.

Thanks a lot!
Fran

@amilajack
Copy link

amilajack commented Sep 24, 2016

Why is sass listed under limitations if it is intentionally not supported?

@gaearon
Copy link
Contributor

gaearon commented Sep 24, 2016

@amilajack Is “limitation” a wrong word for unsupported features?

@amilajack
Copy link

I feel like limitation has the wrong connotation. To me, using 'limitations' almost is almost equivalent to using 'drawbacks' in its place. IMO, something like Unopinionated Features would make more sense.

Thoughts?

@rickharrison
Copy link

For those looking to include sass, I've published a library to accomplish that without using a creact-react-app fork: https://github.com/rickharrison/create-react-app-sass

@gaearon
Copy link
Contributor

gaearon commented Feb 12, 2017

We now have official Sass integration documentation.
Feel free to contribute if something is missing!

nickserv pushed a commit to nickserv/create-react-app that referenced this issue Jul 3, 2018
fix: do not add ESLint config to ejected app
@gaearon
Copy link
Contributor

gaearon commented Oct 2, 2018

Sass is now supported directly.
https://reactjs.org/blog/2018/10/01/create-react-app-v2.html

@selbekk
Copy link
Contributor

selbekk commented Dec 19, 2018

Is there plans of adding Less support? We use it for our design system, and I'd love to add a pull request adding it.

@mrmckeb
Copy link
Contributor

mrmckeb commented Dec 19, 2018

@selbekk, not at this stage (that I'm aware of), but one quick solution is to create a fork of react-scripts, add LESS to that webpack config, and then use that instead of our version. As it would be a small change, it would be very easy to keep up to date with the upstream.

There are other options, like Rescripts, but they're not recommended as you could break stuff.

@selbekk
Copy link
Contributor

selbekk commented Dec 19, 2018

@mrmckeb oh it's easy enough to get working, but it'd be a huge convenience to (for example) create simple sandboxes in codebases that use LESS. :) Like, our design system is based on LESS, and I'd love to add simple reproductions of bugs or whatever with our pull requests and issues.

I guess I could create a fork of react-scripts and just switch out the react-scripts dependency with my own in the sandboxes, but making it a part of the library would be even better.

The bigger question is why not support it, when css modules and sass already is supported?

@mrmckeb
Copy link
Contributor

mrmckeb commented Dec 19, 2018

@selbekk, I wasn't on the team when the decision was made, but as a general rule, more features means more things can go wrong - and it means that every change we make needs to be considered against more variables, which can slow down the project as a whole.

That being said, we're always open to discussion. If you'd like to open an issue, we can discuss this further.

@lock lock bot locked and limited conversation to collaborators Jan 8, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

8 participants