Gatsby: [gatsby-comment-images] Sesuaikan kualitas gambar?

Dibuat pada 28 Okt 2017 · 3Komentar · Sumber: gatsbyjs/gatsby

Apakah ada kemampuan untuk mengkonfigurasi kualitas gambar dalam gatsby-remark-images ? Saya menggunakan screenshot UI di Markdown, dan kompresinya sangat berat sehingga ada banyak artefak.

Melihat sumbernya, saya pikir itu mungkin dikontrol melalui gatsby-plugin-sharp ?. README ada sebutan:

Untuk JPEG, ini menghasilkan gambar progresif dengan tingkat kualitas default 50.

Jika ini sebenarnya yang mengatur kualitas, ini sepertinya default yang masuk akal, tetapi terlalu rendah untuk tujuan saya.

Selain itu, apakah ada alasan opsi tidak ditampilkan di README ? Apakah PR yang menambahkan ini ke berbagai README menarik?

documentation question or discussion

Sumber

dustinhorton

Komentar yang paling membantu

Ini juga berfungsi untuk saya di graphql:

graphql`
{
    allImageSharp {
      edges {
        node {
          ... on ImageSharp {
            fluid(quality: 100, maxWidth: 1600) {
              src
              srcSet
              originalImg
              originalName
              aspectRatio
              sizes
            }
          }
        }
      }
    }
}
`

Dari https://github.com/gatsbyjs/gatsby/issues/3984#issuecomment -364799710

taktran pada 9 Nov 2018

👍6

Semua 3 komentar

Ya, Anda dapat memasukkan kunci quality dengan angka dari 0-100 untuk menimpa kualitas default 50. Tapi ya, mendokumentasikan ini dan lainnya akan sangat bagus! Harapan saya adalah kami memilih cara standar untuk mendokumentasikan / memvalidasi opsi plugin sehingga dokumentasi dapat dibuat secara otomatis dari ini. Jika tugas investigasi yang agak lebih besar ini terdengar seperti sesuatu yang ingin Anda tangani, itu akan menjadi manfaat besar bagi ekosistem.

KyleAMathews pada 28 Okt 2017

👍1

Terima kasih! Itu bekerja dengan baik. Tidak yakin bagaimana memulai tugas yang lebih besar itu (akan memikirkannya), tetapi akan melewati beberapa pembaruan dokumentasi dengan pasti.

Untuk siapa pun yang mengikuti, di sinilah Anda perlu mendefinisikan kunci itu:

module.exports = {
  plugins: [
    {
      resolve: 'gatsby-transformer-remark',
      options: {
        plugins: [
          {
            resolve: 'gatsby-remark-images',
            options: {
              quality: 80,
            },
          },
        ],
      },
    },
  ],
}

dustinhorton pada 28 Okt 2017

❤3 👍3

Ini juga berfungsi untuk saya di graphql:

graphql`
{
    allImageSharp {
      edges {
        node {
          ... on ImageSharp {
            fluid(quality: 100, maxWidth: 1600) {
              src
              srcSet
              originalImg
              originalName
              aspectRatio
              sizes
            }
          }
        }
      }
    }
}
`

Dari https://github.com/gatsbyjs/gatsby/issues/3984#issuecomment -364799710

taktran pada 9 Nov 2018

👍6

Apakah halaman ini membantu?

0 / 5 - 0 peringkat