在 React 的 gh 页面上部署模糊图像

问题描述 投票:0回答:0

我在 github 页面上部署的 Gatsby 博客版本有问题。 我正在使用

gatsby-remark-images
在我的帖子中添加图片。 但是当我部署它时,图像是模糊的。我也有一个关于网站图标的错误。在本地一切正常。

https://lentsius-bark.github.io/krystof-klestil/

module.exports = {
  siteMetadata: {
    title: `Krystof Klestil`,
    siteUrl: `https://www.yourdomain.tld`,
    pathPrefix: "/krystof-klestil",
  },
  
  plugins: [
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `content`,
        path: `${__dirname}/src/content`,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: `${__dirname}/src/images`,
      },
    },

    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `Krystof Klestil`,
        short_name: `Krystof`,
        start_url: `/`,
        background_color: `#f7f0eb`,
        theme_color: `#a2466c`,
        display: `standalone`,
        icon: `src/images/favicon.png`,
        cache_busting_mode: 'none'
      },
    },

    `gatsby-transformer-remark`,
    `gatsby-plugin-sharp`,
    {
      resolve: `gatsby-transformer-remark`,
      options: {
          plugins: [
            {
              resolve: `gatsby-remark-images`,
              options: {
                maxWidth: 1920,
                withWebp: false,
                quality: 100,
                linkImagesToOriginal: false,
          },
        },
      ],
    },
  },
  ],
}

on:
  push:
    branches:
      - master

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v1
      - uses: actions/setup-node@v3
        with:
          node-version: 18
      - uses: enriikke/gatsby-gh-pages-action@v2
        with:
          access-token: ${{ secrets.**** }}
          deploy-branch: gh-pages
          gatsby-args: --prefix-paths

reactjs gatsby github-pages
© www.soinside.com 2019 - 2024. All rights reserved.