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.

Sign up for GitHub

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

Jump to bottom

migrate from LESS to SCSS (via PostCSS) #567

Open
6 tasks done
rsek opened this issue Dec 20, 2022 · 1 comment · May be fixed by #568
Open
6 tasks done

migrate from LESS to SCSS (via PostCSS) #567

rsek opened this issue Dec 20, 2022 · 1 comment · May be fixed by #568

Comments

@rsek
Copy link
Collaborator

rsek commented Dec 20, 2022 •
edited
Loading

SCSS has better tooling, including better Stylelint support (which would be really helpful in taming all the CSS we have). It's also more extensible, and has some exciting plugins (like chroma.js support, and support for advanced colour spaces). Functionally speaking, I don't know of anything we'd lose if we made the switch.

This is also a good opportunity to migrate the pre-processor to PostCSS's SASS plugin, so that all CSS transforms are being managed in one place and we have finer control over what order they fire in.

  • run script to migrate *.less files: https://github.com/debba/less2scss
  • finish cleanup of script results
  • finish migrating *.vue files
  • set up basic stylelint configuration
  • lint everything (where practical)
  • enforce style conventions
@rsek rsek linked a pull request Dec 21, 2022 that will close this issue
Draft
10 tasks
@rsek
Copy link
Collaborator Author

rsek commented Mar 5, 2023

update on this:

  • the migration close to done and theoretically could be merged, but...
  • in my other projects i'm working on are using 100% PostCSS (with plugins to polyfill e.g. CSS draft nesting, and relying on CSS modules for composition)
  • the above works pretty well for tooling with e.g. stylelint so far (might have more to do with me becoming more familiar with the whole, like, ecosystem there)
  • i've been playing with @adobe/leonardo (specifically its leonardo-color-contrast package) some, which could manage a lot of the nuts and bolts of color interpolation themes. its TS support is presently broken, but i've got an open PR for that leonardo-contrast-colors: Restore + enhance typescript support adobe/leonardo#207

in the interest of only having to do this stuff once, it might be better to go straight to a PostCSS instead of bothering with SASS at all. which means more work for me right now but less work for everyone long term. i'm going to open a branch based on the SASS migration branch to explore this.

@rsek rsek mentioned this issue Mar 11, 2023
Merged
7 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Migrate from LESS to SCSS for preprocessing rsek/foundry-ironsworn
1 participant
@rsek