[CSS] Add support for syntax dialects #3416
Draft
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR
Goal
Support different CSS dialects (Basic, PostCSS, Tailwind CSS, ...) in embedded code scenarios including templating support.
Motivation
More and more syntax packages inherit CSS.sublime-syntax to add support for interpolation or embed template tags (e.g.: ASP, JSP, PHP, Liquid, Vue, ...).
Other packages might provide certain dialects of CSS, such as PostCSS or Tailwind CSS.
It is currently not easily possible to embed Tailwind CSS in PHP or Liquid without rewriting each of those syntaxes, because all of them rely on default CSS.sublime-syntax due to inheritance depending on file names rather than scopes.
The motivation is to enable exactly this (again), to benefit from both inheritance and flexibility from 3rd-party packages.
Strategy
The idea is to turn CSS.sublime-syntax into an interface, which is inherit from CSS (Basic) and can be extended by and embedded into syntaxes such as PHP by default, while being able to easily create an
override with
extends
value replaced by desired syntax dialect (e.g.: Tailwind CSS).Note: It follows the idea being discussed in SQL (#3046).
Example
To enable Tailwind CSS in PHP
install Tailwind CSS
modify Tailwind CSS.sublime-syntax to extend from CSS (Basic).sublime-syntax
create a Packages/CSS/CSS.sublime-syntax with following content
A command to choose desired CSS dialect could be provided via Command Palette by something like https://github.com/deathaxe/DefaultSyntaxChooser