{"id":16721064,"url":"https://github.com/khalyomede/gridsome-plugin-manifest","last_synced_at":"2025-07-22T00:34:00.514Z","repository":{"id":36765905,"uuid":"230150211","full_name":"khalyomede/gridsome-plugin-manifest","owner":"khalyomede","description":"Generates a manifest and handle icons generation for your PWA.","archived":false,"fork":false,"pushed_at":"2023-01-06T02:22:41.000Z","size":1132,"stargazers_count":7,"open_issues_count":25,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-07-15T00:18:26.582Z","etag":null,"topics":["gridsome","gridsome-plugin","manifest","pwa"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/gridsome-plugin-manifest","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/khalyomede.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-12-25T20:28:05.000Z","updated_at":"2023-09-08T08:20:58.000Z","dependencies_parsed_at":"2023-01-17T04:45:18.884Z","dependency_job_id":null,"html_url":"https://github.com/khalyomede/gridsome-plugin-manifest","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"purl":"pkg:github/khalyomede/gridsome-plugin-manifest","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khalyomede%2Fgridsome-plugin-manifest","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khalyomede%2Fgridsome-plugin-manifest/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khalyomede%2Fgridsome-plugin-manifest/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khalyomede%2Fgridsome-plugin-manifest/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/khalyomede","download_url":"https://codeload.github.com/khalyomede/gridsome-plugin-manifest/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/khalyomede%2Fgridsome-plugin-manifest/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266404951,"owners_count":23923498,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-21T11:47:31.412Z","response_time":64,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["gridsome","gridsome-plugin","manifest","pwa"],"created_at":"2024-10-12T22:28:33.996Z","updated_at":"2025-07-22T00:34:00.494Z","avatar_url":"https://github.com/khalyomede.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# gridsome-plugin-manifest\n\nGenerates a manifest and handle icons generation for your PWA.\n\n[![npm](https://img.shields.io/npm/v/gridsome-plugin-manifest)](https://www.npmjs.com/package/gridsome-plugin-manifest) [![npm peer dependency version](https://img.shields.io/npm/dependency-version/gridsome-plugin-manifest/peer/gridsome)](https://www.npmjs.com/package/gridsome) [![NPM](https://img.shields.io/npm/l/gridsome-plugin-manifest)](https://github.com/khalyomede/gridsome-plugin-manifest/blob/master/LICENSE) [![Build Status](https://travis-ci.com/khalyomede/gridsome-plugin-manifest.svg?branch=master)](https://travis-ci.com/khalyomede/gridsome-plugin-manifest) [![codecov](https://codecov.io/gh/khalyomede/gridsome-plugin-manifest/branch/master/graph/badge.svg)](https://codecov.io/gh/khalyomede/gridsome-plugin-manifest) ![Snyk Vulnerabilities for npm package](https://img.shields.io/snyk/vulnerabilities/npm/gridsome-plugin-manifest) ![Libraries.io dependency status for latest release](https://img.shields.io/librariesio/release/npm/gridsome-plugin-manifest) [![Maintainability](https://api.codeclimate.com/v1/badges/493c9113d81d8444ad82/maintainability)](https://codeclimate.com/github/khalyomede/gridsome-plugin-manifest/maintainability)\n\n## Summary\n\n- [About](#about)\n- [Features](#features)\n- [Requirements](#requirements)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Changelog](CHANGELOG.md)\n- [API](#api)\n- [Known issues](#known-issues)\n- [Run the tests](#run-the-tests)\n\n## About\n\nI made this plugin because I use gridsome to make my next web app, and I wanted to have a way to just generate this file for me in order to pass the Lighthouse PWA manifest.json test.\n\n## Features\n\n- Generates a `manifest.json` at the root of your dist folder at build time\n- Automatically generates 512, 192, 144, 98, 72, and 48px wide icons from your original icon\n- Adds a `\u003cmeta name=\"theme-color\" /\u003e` and a `\u003clink rel=\"manifest\" /\u003e` (at build time) at the head of each of your HTML files\n\n## Requirements\n\n- NPM or Yarn installed on your machine\n\n## Installation\n\nWith NPM:\n\n```bash\nnpm install --save-dev gridsome-plugin-manifest\n```\n\nWith Yarn:\n\n```bash\nyarn add --dev gridsome-plugin-manifest\n```\n\n## Usage\n\nIn your file `gridsome.config.js`, add the following in the `plugin` key:\n\n```javascript\nmodule.exports = {\n  siteName: \"Gridsome\",\n  plugins: [\n    {\n      use: \"gridsome-plugin-manifest\",\n      options: {\n        background_color: \"#000000\",\n        icon_path: \"./src/assets/img/icon.png\",\n        name: \"My app name\",\n        short_name: \"App\",\n        theme_color: \"#FFFFFF\",\n        lang: \"en\",\n      },\n    },\n  ],\n};\n```\n\nBuild your project:\n\n- With NPM: `npm run build`\n- With Yarn: `yarn build`\n\nTo check it work, serve your application locally, then use Chrome DevTools to run a check on the PWA \"manifest\" test to check it has successfuly taken your manifest file into account.\n\n![google-dev-tools-showing-manifest-passes-test](https://user-images.githubusercontent.com/15908747/71518859-2dc07280-28b5-11ea-8713-600a6bd542f2.png)\n\n## API\n\n- Options\n  - **background_color**: `String` The background of your PWA loading screen\n  - **name**: `String` The name displayed in your PWA loading screen\n  - **theme_color**: `String` The color of the text in your PWA loading screen\n  - **display**: `standalone` | `minimal-ui` | `fullscreen` (default: `minimal-ui`)\n  - **scope**: `String` The scope of your PWA (should be an absolute URL)\n  - **orientation**: `any` | `natural` | `landscape` | `landscape-primary` | `landscape-secondary` | `portrait` | `portrait-primary` | `portrait-secondary` (default: `any`)\n  - **start_url**: `String` The URL where the user will begin if he/she starts your PWA\n  - **file_name**: `String` The name of your manifest file (default: `manifest.json`)\n  - **icon_path**: `String` The path (include the file name) where your icon is stored at\n  - **dir**: `ltr` | `rtl` | `auto` The direction of the text (default: `auto`)\n  - **lang**: `String` An ISO 2 lang code to determine which lang the `name` and `short_name` are displayed on.\n  - **prefer_related_applications**: `Boolean` Whether to prompt to open any link with another app than this PWA or not (default: `false`).\n  - **related_applications**: `Array\u003cRelatedApplication\u003e`: A list of the related applications (see below for the prototype of a `RelatedApplication`).\n\n```typescript\ninterface RelatedApplication {\n  platform: string;\n  url: string;\n  id?: string;\n}\n```\n\n_(`?:` means \"non mandatory field\")._\n\n## Known issues\n\n- The icon **must** be square (the size that is used in the `icons` key of the `manifest.json` file is for the moment `width x width`, so for example a width of `512` will produce a `sizes` key equal to `512x512`)\n\n## Run the tests\n\n1. Clone the project: `git clone https://github.com/khalyomede/gridsome-plugin-manifest`\n2. Install the dependencies\n   - with NPM: `npm install`\n   - with Yarn: `yarn install`\n3. Run the tests\n   - with NPM: `npm run test`\n   - with Yarn: `yarn test`\n\nYou should see something like:\n\n```\n$ nyc mocha --require @babel/register test\n\n\n  client\n    √ should export a function\n\n  server\n    general\n      √ should export a function\n    defaultOptions\n      √ should return default options\n\n\n  3 passing (22ms)\n\n-------------------|---------|----------|---------|---------|-------------------\nFile               | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s\n-------------------|---------|----------|---------|---------|-------------------\nAll files          |    17.8 |     4.88 |    9.52 |   18.92 |\n error-logger.js   |      80 |      100 |       0 |      80 | 8\n ...some.client.js |      50 |      100 |       0 |   66.67 | 2\n ...some.server.js |   13.76 |     4.88 |   10.53 |   14.56 | ...30-232,257-259\n-------------------|---------|----------|---------|---------|-------------------\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkhalyomede%2Fgridsome-plugin-manifest","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkhalyomede%2Fgridsome-plugin-manifest","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkhalyomede%2Fgridsome-plugin-manifest/lists"}