Para qué sirve el archivo manifest.json en Blazor?


Blazor cuenta con un archivo manifest.json dentro de la carpeta wwwroot (Archivos estáticos) que nos permite realizar una configuración general de la aplicación como PWA (Progressive web app). Este archivo se debe actualizar con la información especifica de nuestra App:

{
  "name": "My.BlazorApp",
  "short_name": "My.BlazorApp",
  "start_url": "./",
  "display": "standalone",
  "background_color": "#ffffff",
  "theme_color": "#03173d",
  "icons": [
    {
      "src": "icon-512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ]
}

Este archivo también conocido como Web App manifest nos ayuda a definir las especificaciones que tendrá la app cuando se instale dentro del equipo.

name: Representa el nombre de la app que se visualizara cuando se instale

short_name: Se utiliza en el home y otros lugares donde el número de caracteres es limitado

start_url: Representa la URL por defecto donde se abrirá la aplicación

display: Indica la forma en que la aplicación se visualizara al momento de abrirse. Tenemos 3 opciones, fullscreen, standalone y minimal-ui

  • fullscreen: abre la app en pantalla completa al abrirse
  • standalone: abre la app desde una pestaña del navegador como una app independiente
An example of a PWA window with standalone display.
  • minimal-ui: abre la app con los controles básicos de navegación refresh y regresar
An example of a PWA window with minimal-ui display.

background_color: se refiere al color de fondo de la pantalla inicial cuando es instalada en un dispositivo móvil.

theme_color: se refiere al color del barra de herramientas o toolbar una vez la app es instalada

icons: colección de iconos de la app que serán usados al momento de instalarse, blazor trae por defecto un icono 512×512 con el logo de blazor que debe ser reemplazado el de nuestra App

Mas información en: https://web.dev/add-manifest/

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s