angular / angular-cli

CLI tool for Angular
https://cli.angular.io
MIT License
26.72k stars 11.98k forks source link

PWA Schematic: generate Artifacts / link and meta for iOS #23504

Open d-koppenhagen opened 2 years ago

d-koppenhagen commented 2 years ago

πŸš€ Feature request

Command (mark with an x)

Description

Adding PWA functionality using the provided schematic will already generate an example manifest file and icons linked in it. Using a PWA on iOS will evaluate special <link>/<meta> tags for things such as Splashscreen or Statusbar customization.

Some details can be found here: https://appsco.pe/developer/splash-screens

This necessary tags should be generated by the schematic by default or at least by providing an option like --ios.

Describe the solution you'd like

Generate example spalshscreen for iOS and link it in index.html when an option --ios is set:

ng add @angular/pwa --ios

This will cause:

<!doctype html>
<html lang="en">
<head>
  ...
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="default">
  <link rel="apple-touch-startup-image" href="assets/splashscreen-ios.png">
  <link rel="apple-touch-icon" href="assets/icons/icon-512x512.png">
</head>
...
</html>

Describe alternatives you've considered

Have you considered any alternative solutions or workarounds?
alan-agius4 commented 2 years ago

This is interesting.

Couple of points from the official docs https://developer.apple.com/design/human-interface-guidelines/patterns/launching

1) The launch screen isn't a splash screen and should not be used as such. The launch screen should be nearly identical to the first screen of the app. (Somewhat similar to an app-shell I guess). 1) The official docs lack info about dimensions that launch screens are needed. 2) Launch screens need to be provided for both landscape and portrait mode.

angular-robot[bot] commented 2 years ago

This feature request is now candidate for our backlog! In the next phase, the community has 60 days to upvote. If the request receives more than 20 upvotes, we'll move it to our consideration list.

You can find more details about the feature request process in our documentation.

angular-robot[bot] commented 2 years ago

Just a heads up that we kicked off a community voting process for your feature request. There are 20 days until the voting process ends.

Find more details about Angular's feature request process in our documentation.

angular-robot[bot] commented 2 years ago

Thank you for submitting your feature request! Looks like during the polling process it didn't collect a sufficient number of votes to move to the next stage.

We want to keep Angular rich and ergonomic and at the same time be mindful about its scope and learning journey. If you think your request could live outside Angular's scope, we'd encourage you to collaborate with the community on publishing it as an open source package.

You can find more details about the feature request process in our documentation.