Gatsby build para compilar nuestro proyecto

Vamos a compilar nuestro proyecto de Gatsby para generar un sitio estático que podamos mandar a producción:

npm run build
# También:
gatsby build

Recuerda que debes crear un nuevo archivo llamado .env.production para la configuración real de tus productos en Stripe (de otra forma, los usuarios solo podrán hacer compras ficticias).

También debemos añadir la configuración del archivo gatsby-browser.js a gatsby-ssr.js:

const React = require("react");
const Layout = require("./src/components/layout").default;
const { GlobalStyles } = require("./src/styles");
const { CartProvider } = require("./src/context");

exports.wrapRootElement = ({ element }) => (
  <CartProvider>
    <GlobalStyles />
    <Layout>{element}</Layout>
  </CartProvider>
);

Por último, vamos a usar el plugin gatsby-plugin-styled-components para que nuestra aplicación tenga sus estilos al compilar el código de React.js:

// gatsby-config.js
plugins: [
  `gatsby-plugin-styled-components`,
  /* ... */
],