Блог

Я следую руководству YouTube по Gatsby Bootcamp от Эндрю Мида, и до 3: 10: 00 минут все работало гладко, но как только я устанавливаю gatsby-remark-relative-images и gatsby-remark-images плагин и добавляю их в gatsby-config.js файл для отображения изображений, и при запуске npm run develop я получаю ошибку, подобную показанной ниже.

Ниже приведен мой gatsby-config.js файл.

 /**
 * Configure your Gatsby site with this file.
 *
 * See: https://www.gatsbyjs.org/docs/gatsby-config/
 */

module.exports = {
  /* Your site config here */

  siteMetadata:{
    title:'Gatsby Bootcamp',
    author:'Author'
  },
  plugins: [
    'gatsby-plugin-sass',
    {
      resolve:'gatsby-source-filesystem',
      options:{
        name: 'src',
        path: `${__dirname}/src/`
      }
    },
    'gatsby-plugin-sharp',
    {
      reslove: 'gatsby-transformer-remark',
      options:{
        plugins:[
          'gatsby-remark-relative-images',
          {
            resolve:'gatsby-remark-images',
            options:{
              maxWidth:750,
              linkImagesToOriginal: false
            }
          }
        ]
      }
    }
  ]
}  

Пожалуйста, помогите! Заранее благодарю вас.

Как объясняется в документации, вы должны добавить следующий фрагмент в свой gatsby-node.js :

 const { fmImagesToRelative } = require('gatsby-remark-relative-images');

exports.onCreateNode = ({ node }) => {
  fmImagesToRelative(node);
};
  

Это использует каждый узел, возвращенный вашими плагинами gatsby-source, и преобразует любые абсолютные пути в данных markdown frontmatter в относительные пути, если найден соответствующий файл.