¿Existe la posibilidad de configurar la calidad de la imagen dentro de gatsby-remark-images
? Estoy usando capturas de pantalla de la interfaz de usuario en Markdown, y la compresión es tan dura que hay una considerable cantidad de artefactos.
Mirando la fuente, creo que podría controlarse a través de gatsby-plugin-sharp
?. README
allí se menciona:
Para los archivos JPEG, genera imágenes progresivas con un nivel de calidad predeterminado de 50.
Si esto es lo que establece la calidad, parece un valor predeterminado razonable, pero es demasiado bajo para mis propósitos.
Además, ¿hay alguna razón por la que las opciones no estén expuestas en el archivo README ? ¿Sería de interés que los RP los agreguen a los distintos README?
Sí, puede pasar una clave quality
con un número del 0 al 100 para anular la calidad predeterminada de 50. ¡Pero sí, documentar esto y otros sería genial! Mi esperanza ha sido que elijamos una forma estándar de documentar / validar las opciones de complementos para que la documentación se pueda generar automáticamente a partir de esto. Si esta tarea algo más grande de investigar esto suena como algo que desea abordar, sería un gran beneficio para el ecosistema.
¡Gracias! Eso funcionó muy bien. No estoy seguro de cómo comenzar esa tarea más grande (lo pensaré un poco), pero seguramente pasará algunas actualizaciones de la documentación.
Para cualquiera que lo siga, aquí es donde debe definir esa clave:
module.exports = {
plugins: [
{
resolve: 'gatsby-transformer-remark',
options: {
plugins: [
{
resolve: 'gatsby-remark-images',
options: {
quality: 80,
},
},
],
},
},
],
}
Esto también funcionó para mí en graphql:
graphql`
{
allImageSharp {
edges {
node {
... on ImageSharp {
fluid(quality: 100, maxWidth: 1600) {
src
srcSet
originalImg
originalName
aspectRatio
sizes
}
}
}
}
}
}
`
De https://github.com/gatsbyjs/gatsby/issues/3984#issuecomment -364799710
Comentario más útil
Esto también funcionó para mí en graphql:
De https://github.com/gatsbyjs/gatsby/issues/3984#issuecomment -364799710