angularmigrationangular17

How to automatically migrate from `styleUrls` to `styleUrl` in Angular 17 components?


Angular 17 has introduced styleUrl as a convenience for cases where there's only one stylesheet in the @Component's styleUrls.

How to automatically migrate from styleUrls to styleUrl in an existing codebase?


Solution

  • How about Replace all with regex? The following regex searches for all arrays that contain only one string (assuming you use single quotes).

    Search: styleUrls: \['([^']*)'\]

    Replace: styleUrl: '$1'