Skip to content

feat(core): support styles and styleUrl as strings#51715

Closed
crisbeto wants to merge 1 commit intoangular:mainfrom
crisbeto:component-styles-string
Closed

feat(core): support styles and styleUrl as strings#51715
crisbeto wants to merge 1 commit intoangular:mainfrom
crisbeto:component-styles-string

Conversation

@crisbeto
Copy link
Copy Markdown
Member

@crisbeto crisbeto commented Sep 9, 2023

Adds support for passing in @Component.styles as a string. Also introduces a new styleUrl property on @Component for providing a single stylesheet. This is more convenient for the most common case where a component only has one stylesheet associated with it.

@crisbeto crisbeto added action: review The PR is still awaiting reviews from at least one requested reviewer area: core Issues related to the framework runtime target: major This PR is targeted for the next major release labels Sep 9, 2023
@ngbot ngbot Bot modified the milestone: Backlog Sep 9, 2023
@angular-robot angular-robot Bot added the detected: feature PR contains a feature commit label Sep 9, 2023
@eneajaho
Copy link
Copy Markdown
Contributor

eneajaho commented Sep 9, 2023

Hello @crisbeto

This example below looks like it accepts multiple urls because of the naming.
styleUrls: 'dir/styles.css, dir/styles1.css'

Imo, The correct way it should look like is:
styleUrl: 'dir/styles.css'

But that would require big changes I believe.

@crisbeto
Copy link
Copy Markdown
Member Author

crisbeto commented Sep 9, 2023

Yeah, I agree that the naming is problematic, but I think that splitting it on the comma would be weird as well. Introducing a styleUrl property won't be that much more work to support, but it increases the API surface. WDYT @jelbourn?

@jnizet
Copy link
Copy Markdown
Contributor

jnizet commented Sep 9, 2023

My two cents here: the Angular API already has at least one other place where it uses the plural form to also accept a single thing: https://angular.io/api/forms/AbstractControlOptions. So keeping styleUrls would at least be consistent.

@crisbeto crisbeto modified the milestones: Backlog, v17-candidates Sep 11, 2023
@crisbeto crisbeto force-pushed the component-styles-string branch from 345c50e to 4a55966 Compare September 11, 2023 11:07
@crisbeto crisbeto changed the title feat(core): support styles and styleUrls as strings feat(core): support styles and styleUrl as strings Sep 11, 2023
@crisbeto
Copy link
Copy Markdown
Member Author

Based on what we discussed with @jelbourn: I've introduced a new styleUrl property and kept styleUrls as a string[].

@crisbeto crisbeto force-pushed the component-styles-string branch from 4a55966 to 3b94c22 Compare September 11, 2023 11:15
Copy link
Copy Markdown
Member

@pkozlowski-opensource pkozlowski-opensource left a comment

Choose a reason for hiding this comment

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

LGTM

Reviewed-for: public-api
Reviewed-for: fw-core

Comment thread packages/core/test/metadata/resource_loading_spec.ts Outdated
Adds support for passing in `@Component.styles` as a string. Also introduces a new `styleUrl` property on `@Component` for providing a single stylesheet. This is more convenient for the most common case where a component only has one stylesheet associated with it.
@crisbeto crisbeto force-pushed the component-styles-string branch from 3b94c22 to 1d26f71 Compare September 11, 2023 11:57
@pullapprove pullapprove Bot requested review from alxhub and atscott September 11, 2023 15:46
Copy link
Copy Markdown
Contributor

@jessicajaniuk jessicajaniuk left a comment

Choose a reason for hiding this comment

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

reviewed-for: fw-core, fw-testing, public-api

@jessicajaniuk jessicajaniuk added action: merge The PR is ready for merge by the caretaker action: presubmit The PR is in need of a google3 presubmit and removed action: review The PR is still awaiting reviews from at least one requested reviewer labels Sep 11, 2023
@crisbeto crisbeto removed the action: presubmit The PR is in need of a google3 presubmit label Sep 12, 2023
@AndrewKushnir
Copy link
Copy Markdown
Contributor

This PR was merged into the repository by commit 59387ee.

@spock123
Copy link
Copy Markdown

Thank you guys, I know this is a silly small thing but it's really something I bet all developers have come across: it really makes the developing experience better, because 99% of all cases there'll only be 1 styles file. Thanks!!!

@angular-automatic-lock-bot
Copy link
Copy Markdown

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot Bot locked and limited conversation to collaborators Oct 16, 2023
ChellappanRajan pushed a commit to ChellappanRajan/angular that referenced this pull request Jan 23, 2024
Adds support for passing in `@Component.styles` as a string. Also introduces a new `styleUrl` property on `@Component` for providing a single stylesheet. This is more convenient for the most common case where a component only has one stylesheet associated with it.

PR Close angular#51715
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker area: core Issues related to the framework runtime detected: feature PR contains a feature commit target: major This PR is targeted for the next major release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants