Components

Do you have multiple templates and you want to share components between these templates? Create a /components directory in the root of your project. Then, you can import the components as usual.

mkdir components
PROJECT-NAME/
โ”‚ ...
โ”œโ”€โ”€ components/
โ”‚ โ””โ”€โ”€ Title.js
โ”œโ”€โ”€ templates/
โ”‚ โ”œโ”€โ”€ blog-post.js
โ”‚ โ””โ”€โ”€ home.js
โ”‚ ...

Here is an example:

components/Title.js
import React from "react";
export function Title(props) {
return <h1 {...props} />;
}
templates/home.js
import React from "react";
import { Title } from "../components/Title";
export default function HomeTemplate({ variables })) {
return <Title>{variables.title}</Title>;
}