基本的Gatsby Shopify示例缺少布局

import React from "react";
import { Link } from "gatsby";

const Layout = ({ children }) => {
  return (
    <div>
      <header>
        <nav>
          <ul>
            <li>
              <Link to="/">Home</Link>
            </li>
            <li>
              <Link to="/products">Products</Link>
            </li>
            <li>
              <Link to="/about">About</Link>
            </li>
          </ul>
        </nav>
      </header>
      <main>{children}</main>
      <footer>
        <p>© 2022 Your Company. All rights reserved.</p>
      </footer>
    </div>
  );
};

export default Layout;

import React from "react";
import Layout from "../components/layout";

const IndexPage = () => {
  return (
    <Layout>
      <h1>Welcome to our Gatsby Shopify example!</h1>
      <p>Here is the content of the homepage.</p>
    </Layout>
  );
};

export default IndexPage;