我正在将graphQL集成到我的gatsby网站中。我收到一条错误消息,指出“仅支持绝对URL”,然后指向节点获取库中的某些代码。但是,我没有一条明显的途径来执行该代码,因此我不确定问题的根源是什么。我花了几天的时间进行搜索,尽管发现了多个有关此错误的线程,但从来没有出现在gatsby-source-graphql的上下文中。任何帮助将不胜感激。
package.json
{
.
.
.
"dependencies": {
"ajv": "^6.9.2",
"core-js": "^2.6.5",
"fullcalendar": "^3.9.0",
"fullcalendar-reactwrapper": "^1.0.7",
"gatsby": "^2.12.0",
"gatsby-cli": "^2.7.20",
"gatsby-plugin-manifest": "^2.0.2",
"gatsby-plugin-netlify-cms": "^4.0.1",
"gatsby-plugin-offline": "^2.0.5",
"gatsby-plugin-react-helmet": "^3.0.0",
"gatsby-plugin-sass": "^2.0.1",
"gatsby-source-filesystem": "^2.1.6",
"gatsby-source-graphql": "^2.1.3",
"gatsby-transformer-remark": "^2.6.9",
"graphql": "^14.1.1",
"jquery": "^3.3.1",
"moment": "^2.22.2",
"netlify-cms-app": "^2.9.1",
"node-sass": "^4.9.3",
"react": "^16.5.1",
"react-calendar": "^2.17.5",
"react-dom": "^16.6.3",
"react-helmet": "^5.2.0",
"react-native-calendars": "^1.21.0"
},
.
.
.
"devDependencies": {
"@material-ui/core": "^3.9.2",
"@material-ui/icons": "^3.0.2",
"material-icons-react": "^1.0.4",
"prettier": "^1.14.2",
"react-tooltip": "^3.9.2",
"surge": "^0.20.1"
},
.
.
.
}
UpcomingScheduleChanges.js
import React from 'react';
import { StaticQuery, graphql } from 'gatsby';
import Cancellations from './Cancellations';
class UpcomingScheduleChanges extends React.Component {
render() {
console.log(this.props.cancellations)
return (
<div className="col-6">
<header className="major">
<h2>Upcoming Schedule Changes</h2>
</header>
{this.props.cancellations ? (
<Cancellations cancellations={this.props.cancellations}></Cancellations>
) : (
<p>There are no upcomimng schedule changes!</p>
)}
</div>
)
}
}
export default () => (
<StaticQuery
query={graphql`
query ScheduleChanges {
allMarkdownRemark {
edges {
node {
frontmatter {
cancellation {
date(formatString: "MMMM DD")
day
location
type
}
}
}
}
}
}
`}
render={(data) => <UpcomingScheduleChanges cancellations={data.allMarkdownRemark.edges[0].node.frontmatter.cancellation} />}
/>
);
index.js
import React from "react";
import Helmet from "react-helmet";
import Layout from "../components/layout";
import ReactTooltip from "react-tooltip";
import ContactForm from "../components/ContactForm";
import Schedule from '../components/Schedule';
import Welcome from "../components/Welcome";
import Administrators from "../components/Administrators";
import MailingList from "../components/MailingList";
class Homepage extends React.Component {
handleClick(url) {
window.open(url, "_blank");
}
render() {
const siteTitle = "...";
return (
<Layout>
<Helmet title={siteTitle}>
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
</Helmet>
<Welcome></Welcome>
<Schedule></Schedule>
<Administrators></Administrators>
<MailingList></MailingList>
<ContactForm></ContactForm>
<ReactTooltip />
<script>
{`if (window.netlifyIdentity) {
window.netlifyIdentity.on("init", user => {
if (!user) {
window.netlifyIdentity.on("login", () => {
document.location.href = "/admin/";
});
}
});
}`}
</script>
</Layout>
);
}
}
export default Homepage;
gatsby-config.js
module.exports = {
siteMetadata: {
title: "...",
author: "...",
description: "..."
},
plugins: [
'gatsby-plugin-react-helmet',
{
resolve: `gatsby-plugin-manifest`,
options: {
name: '...',
short_name: '...',
start_url: '/',
background_color: '#FFFFFF',
theme_color: '#FFFFFF',
display: 'minimal-ui',
icon: 'src/assets/images/banner_small.png', // This path is relative to the root of the site.
},
},
'gatsby-plugin-sass',
'gatsby-transformer-remark',
{
resolve: 'gatsby-source-filesystem',
options: {
path: `${__dirname}/static/content`,
name: 'content'
}
},
{
resolve: "gatsby-source-graphql",
options: {
typeName: "cancellations",
fieldName: "cancellations",
url: `${__dirname}/static/content/cancellations.md`
}
},
'gatsby-plugin-offline',
'gatsby-plugin-netlify-cms'
],
}
config.yml
backend:
name: git-gateway
branch: master #branch to update (optional; defaults to master)
publish_mode: editorial_workflow #allows for a drafting, reviewing, and approving process for changes
media_folder: "src/assets/images/uploads"
public_folder: "/images"
#collections
collections:
- label: "Upcoming Schedule Changes"
name: "upcoming schedule changes"
files:
- label: "Cancellations"
name: "cancellations"
file: "static/content/cancellations.md"
fields:
- label: "Cancellations"
name: "cancellations"
create: true
widget: "list"
fields:
- {label: "Date", name: "date", widget: "date"}
- {label: "Day", name: "day", widget: "select", options: ["Thursday", "Friday", "Sunday"]}
- {label: "Location", name: "location", widget: "select", options: ["Location1", "Location2", "Location3"]}
- {label: "Type", name: "type", widget: "select", options: ["Cancelled", "Delayed", "Relocated"]}