Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(gatsby-plugin-manifest): Fix incorrect favicons size bug #12081

Merged
merged 6 commits into from
Mar 27, 2019
Merged

fix(gatsby-plugin-manifest): Fix incorrect favicons size bug #12081

Changes from 3 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
1087a92
fix(gatsby-plugin-manifest): Fix incorrect favicons size bug (#12051)
keidrun Feb 25, 2019
5d01ae6
fix: non square image issue
moonmeister Mar 19, 2019
8bcd80c
fix: lint error
moonmeister Mar 22, 2019
f04ca7e
fix: cleanup warning
moonmeister Mar 22, 2019
811ecdc
refactor: move to async await
moonmeister Mar 22, 2019
534a327
test: fix tests to work with sharp.metadata()
moonmeister Mar 22, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 19 additions & 3 deletions packages/gatsby-plugin-manifest/src/gatsby-node.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,13 +33,17 @@ function generateIcons(icons, srcIcon) {
// Sharp accept density from 1 to 2400
const density = Math.min(2400, Math.max(1, size))
return sharp(srcIcon, { density })
.resize(size)
.resize({
width: size,
height: size,
fit: `contain`,
background: { r: 255, g: 255, b: 255, alpha: 0 },
})
.toFile(imgPath)
.then(() => {})
})
}

exports.onPostBootstrap = async (args, pluginOptions) => {
exports.onPostBootstrap = async ({ reporter }, pluginOptions) => {
const { icon, ...manifest } = pluginOptions

// Delete options we won't pass to the manifest.webmanifest.
Expand Down Expand Up @@ -69,6 +73,18 @@ exports.onPostBootstrap = async (args, pluginOptions) => {
throw `icon (${icon}) does not exist as defined in gatsby-config.js. Make sure the file exists relative to the root of the site.`
}

let sharpIcon = sharp(icon)

sharpIcon.metadata().then(metadata => {
if (metadata.width !== metadata.height) {
reporter.warn(
`The icon(${icon}) you provided to 'gatsby-plugin-manifest' is not square. \n` +
moonmeister marked this conversation as resolved.
Show resolved Hide resolved
`The icons we generate will be square and for the best results we recommend you provide a square icon. \n` +
moonmeister marked this conversation as resolved.
Show resolved Hide resolved
`We'll do our best with what you provide :)`
moonmeister marked this conversation as resolved.
Show resolved Hide resolved
)
}
})

//add cache busting
const cacheMode =
typeof pluginOptions.cache_busting_mode !== `undefined`
Expand Down