hint that that checks if the web app manifest file is valid
npm install @hint/hint-manifest-is-validmanifest-is-valid)manifest-is-valid checks if the content of the web app manifest
file is valid JSON, valid according to the specification, and the
property values work in all [targeted browsers][targeted browsers].
Web app manifest files that don't contain valid JSON are ignored by
user agents. The same goes for invalid property values or non-standard
properties.
Also, providing property values that are only supported by certain
user agents for which the [specification][manifest spec] does not
define a fallback, can lead to compatibility issues.
manifest-is-valid checks if:
* The content of the web app manifest file is valid JSON, and valid
according to the specification, namely:
* No additional properties are specified.
* All property values are of the type specified by the specification.
* The property values work in all [targeted browsers][targeted browsers].
The web app manifest file contains invalid JSON:
``json`
{
"name": "invalid
}
The web app manifest file contains additional non-standard properties
`json`
{
"additional_non-standard_property": "invalid",
"name": "example name",
...
}
or [deprecated properties][density issue]:
`json`
{
"icons": [{
"density: 2",
...
}],
...
}
Web app manifest file contains property values of a type different
then what is specified by the specification, e.g. name is a numberstring
instead of a :
`json`
{
"name": 5,
...
}
The web app manifest file contains properties with invalid values:
`json`
{
"lang": "en-x",
...
}
`json`
{
"theme_color": "invalid",
...
}
The web app manifest file contains properties with values not
supported by all the [targeted browsers][targeted browsers].
`json`
{
"theme_color": "#ff0000aa",
...
}
The content of the web app manifest file is valid JSON, valid
according to the specification, and the property values work in
[targeted browsers][targeted browsers]:
`json`
{
"background_color": "red",
"description": "Example of a progressive web app",
"icons": [{
"src": "icon.png",
"sizes": "512x512",
"type": "image/png"
}],
"name": "Example progressive web app",
"short_name": "Example",
"start_url": "index.html",
"theme_color": "red"
}
This package is installed automatically by webhint:
`bash`
npm install hint --save-dev
To use it, activate it via the [.hintrc][hintrc] configuration file:
`json`
{
"connector": {...},
"formatters": [...],
"hints": {
"manifest-is-valid": "error",
...
},
"parsers": [...],
...
}
Note: The recommended way of running webhint is as a devDependency` of
your project.
* [Web App Manifest specification][manifest spec]
[density issue]: https://github.com/w3c/manifest/issues/450
[manifest spec]: https://w3c.github.io/manifest/
[hintrc]: https://webhint.io/docs/user-guide/configuring-webhint/summary/
[targeted browsers]: https://webhint.io/docs/user-guide/configuring-webhint/browser-context/