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

feat(css): support internal Sass/SCSS in HTML(#17672) #17816

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

feat(css): support internal Sass/SCSS in HTML(#17672) #17816

wants to merge 3 commits into from

Conversation

danielnelson09
Copy link

Description

Have added support for internal css preprocessor as requested in #17672

@stackblitz StackBlitz
Copy link

stackblitz bot commented Aug 3, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@danielnelson09 danielnelson09 changed the title feat(css):Support internal Sass/SCSS in HTML(#17672) feat(css): Support internal Sass/SCSS in HTML(#17672) Aug 3, 2024
@danielnelson09 danielnelson09 changed the title feat(css): Support internal Sass/SCSS in HTML(#17672) feat(css): support internal Sass/SCSS in HTML(#17672) Aug 3, 2024
@bluwy bluwy linked an issue Aug 5, 2024 that may be closed by this pull request
Support internal Sass/SCSS in HTML #17672
Open
4 tasks
bluwy
bluwy reviewed Aug 5, 2024
View reviewed changes
Copy link
Member

@bluwy bluwy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall the implementation looks great! I want to confirm with others if we want to support lang as the detection attribute here first, since the attribute is originally for locales not preprocessors. I don't think it's a big problem though if we follow precedence from vue, svelte, and astro.

packages/vite/src/node/server/middlewares/indexHtml.ts Outdated Show resolved Hide resolved
bluwy
bluwy reviewed Aug 7, 2024
View reviewed changes
packages/vite/src/node/server/sourcemap.ts
Comment on lines -94 to +103
type: 'js' | 'css',
type:
| 'js'
| 'css'
| 'less'
| 'sass'
| 'scss'
| 'styl'
| 'stylus'
| 'pcss'
| 'postcss',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This can now be reverted as well

@bluwy
Copy link
Member

bluwy commented Aug 7, 2024

Something I just realized is that VSCode (not sure about other IDEs) don't highlight scss/stylus/etc syntax in the <style lang=".."> tags and always treat as css, which is a bit unfortunate. I'm not sure if this will impact this PR, but it would be a hard sell for users to use this feature if the IDE shows errors by default.

@bluwy bluwy added the p2-to-be-discussed Enhancement under consideration (priority) label Aug 15, 2024
@sapphi-red
Copy link
Member

We discussed about this PR in the last team meeting. We concluded that if not many tools (e.g. IDEs, formatter) supports this it won't be useful and prefer not having it in core. If you know any tools that support this format, please let us know.

@bluwy bluwy mentioned this pull request Oct 16, 2024
Open
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@bluwy bluwy bluwy left review comments

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
p2-to-be-discussed Enhancement under consideration (priority)
Projects
Team Board
Status: Later
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Support internal Sass/SCSS in HTML
3 participants
@danielnelson09 @bluwy @sapphi-red