我用宇航员从基本默认的盖茨比启动器构建了这个项目
我不知道我做错了什么，因为这个项目在gatsby-node和gatsby-config方面与我的另一个项目非常相似。此错误在控制台中重复循环
TypeError: fmImagesToRelative is not a function
- gatsby-node.js:38 Object.exports.onCreateNode
/Users/Sam/Documents/Projects_and_Code/Web_Dexter_V2/gatsby-node.js:38:3
- api-runner-node.js:330 runAPI
[Web_Dexter_V2]/[gatsby]/src/utils/api-runner-node.js:330:22
- api-runner-node.js:440 Promise.catch.decorateEvent.pluginName
[Web_Dexter_V2]/[gatsby]/src/utils/api-runner-node.js:440:17
- From previous event:
- api-runner-node.js:440 Promise.catch.decorateEvent.pluginName
[Web_Dexter_V2]/[gatsby]/src/utils/api-runner-node.js:440:9
- From previous event:
- api-runner-node.js:439
[Web_Dexter_V2]/[gatsby]/src/utils/api-runner-node.js:439:14
- timers.js:456 processImmediate
internal/timers.js:456:21
- From previous event:
...
gatsby-node.js
const { createFilePath } = require(`gatsby-source-filesystem`)
const { fmImagesToRelative } = require('gatsby-remark-relative-images');
const path = require("path")
exports.createPages = async ({ actions: { createPage }, graphql }) => {
const postTemplate = path.resolve(`src/components/ArticlePage/index.tsx`)
const result = await graphql(`
{
allMarkdownRemark(
sort: { order: DESC, fields: [frontmatter___date] }
) {
edges {
node {
fields {
slug
}
}
}
}
}
`)
if (result.errors) {
return Promise.reject(result.errors)
}
result.data.allMarkdownRemark.edges.forEach(({ node }) => {
createPage({
path: `${node.fields.slug}`,
component: postTemplate,
})
})
}
exports.onCreateNode = ({ node, getNode, actions }) => {
fmImagesToRelative(node)
if (node.internal.type === `MarkdownRemark`)
actions.createNodeField({
node,
name: `slug`,
value: createFilePath({ node, getNode, basePath: `pages`, trailingSlash: true}),
})
}gatsby-config.js
const path = require(`path`)
module.exports = {
siteMetadata: {
title: `Web Dexter | Saskatoon Website Design and Mobile App Design`,
description: `Web Dexter is a web design, and mobile app design company located in Saskatoon, SK. We also do logo design and graphic design. (306)-241-7019.`,
author: `Web Dexter Design`,
authorDescription: "Saskatoon Web and App Design Company",
themeColor: "#d2f5fb",
siteUrl: "https://webdexter.ca",
socialLinks: {
facebook: "/",
instagram: "/",
linkedin: "https://linkedin.com/company/web-dexter",
twitter: "/"
}
// image: "https://suddenlysask.com/static/54f3be73c004e26215a4a0cbf82c4524/ad85c/suddenly-saskatchewan-logo.webp"
},
plugins: [
{
resolve: `gatsby-source-filesystem`,
options: {
name: `images`,
path: `${__dirname}/src/assets/images`,
},
},
{
resolve: `gatsby-source-filesystem`,
options: {
path: `${__dirname}/content/markdown/`,
name: `markdown-pages`,
},
},
{
resolve: `gatsby-plugin-create-client-paths`,
options: { prefixes: [
`/contact/*`,
] },
},
{
resolve: `gatsby-plugin-manifest`,
options: {
name: `gatsby-starter-default`,
short_name: `starter`,
start_url: `/`,
background_color: `#663399`,
theme_color: `#663399`,
display: `minimal-ui`,
icon: `src/assets/images/gatsby-icon.png`, // This path is relative to the root of the site.
},
},
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
'gatsby-remark-relative-images',
{
resolve: `gatsby-remark-images`,
options: {
backgroundColor: "transparent",
maxWidth: "800",
disableBgImageOnAlpha: true,
linkImagesToOriginal: false,
withWebp: true,
loading: "eager"
},
},
],
},
},
{
resolve: 'gatsby-plugin-root-import',
options: {
"components": path.join(__dirname, "src/components"),
"styles": path.join(__dirname, "src/assets/styles"),
"interfaces": path.join(__dirname, "src/interfaces"),
"data": path.join(__dirname, 'src/data'),
"pages": path.join(__dirname, 'src/pages'),
"svg": path.join(__dirname, "src/assets/images/svg"),
"hooks": path.join(__dirname, "src/hooks"),
"types": path.join(__dirname, "src/types")
}
},
`gatsby-transformer-sharp`,
`gatsby-plugin-sharp`,
`gatsby-plugin-typescript`,
`gatsby-plugin-react-helmet`,
`gatsby-plugin-sass`,
`gatsby-plugin-offline`,
`gatsby-plugin-sitemap`,
`gatsby-plugin-netlify`,
// `gatsby-plugin-preact`,
`gatsby-transformer-json`,
{
resolve: `gatsby-source-filesystem`,
options: {
name: `data`,
path: `${__dirname}/src/data`
}
},
{
resolve: 'gatsby-plugin-react-svg',
options: {
rule: {
include: /svg/
}
}
},
{
resolve: `gatsby-plugin-purgecss`,
options: {
// printRejected: true, // Print removed selectors and processed file names
purgeOnly: ['src/assets/styles', 'src/components','node_modules/'],
ignore: ['node_modules/'],
whitelist: [],
whitelistPatterns: []
}
},
],
}这与gatsby-remark-relative-images: "^2.0.2"有关，当使用版本^0.3.0而不是^2.0.2或使用"gatsby-remark-relative-images-v2": "^0.1.5",时，问题停止发生。这在他们的github页面上有说明