Repo Structure | Yext Hitchhikers Platform
This page will walk through the structure of a basic PagesJS project. Most repos will look similar to this but wonβt always be exactly the same.
.
βββ src
β βββ templates
β β βββ location.tsx
β β βββ static.tsx
β βββ components
β β βββ Header.tsx
β β βββ Footer.tsx
β β βββ etc...
βββ sites-config
β βββ ci.json <-- required
β βββ serving.json
β βββ site-stream.json
β βββ auth.json
β βββ redirects.csv
β βββ features.json <-- Autogenerated - do not edit
βββ package.json
βββ postcss.config.cjs
βββ tailwind.config.js
βββ vite.config.js
βββ README.md
src/templates
This folder contains all of the templates that will render your site. All templates need to be placed in this specific folder, but no directories should be included under templates
.
You can learn more about templates in this reference doc .
src/components
By convention, we recommend using a components
folder to store any shared components that are used across templates. This folder could be named anything you want and there is nothing special about this folder name.
sites-config/ci.json
The ci.json
file configures the CI (continuous integration) system for Yext Pages. The build process is defined in this configuration file. For most sites, you will not need to edit this configuration but for more advanced build processes, this is the place to go. You can
learn more here
.
sites-config/serving.json
The serving.json
file can be used to configure a reverse proxy setup. You can learn more about
reverse proxies here
.
sites-config/site-stream.json
Use this file to define a stream for global data that can be used by any template. Learn more about global data .
sites-config/auth.json
Use this file to define the authentication schema for the site.
sites-config/redirects.csv
An optional redirects file. Learn more about Redirects .
sites-config/features.json
The features.json
file is an auto-generated file that determines the structure and configuration of the site. It is generated after running yext pages generate
. You should not edit this file.
vite.config.js
The local dev server and build toolchain are handled by Vite . The starter includes a vite config file that looks like this:
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import yextSSG from "@yext/pages/vite-plugin";
export default defineConfig({
plugins: [react(), yextSSG()],
});
It uses two plugins, React and the Yext build plugin.
tailwind.config.cjs
The basic starter uses Tailwind by default. This is the tailwind configuration file. Learn more about styling .
postcss.config.cjs
The starter repo uses
postcss
to pre-process the css. This is configured by default to work with tailwind
and autoprefixer
but can be updated to fit any css pipeline. Learn more about
styling
.
package.json
This file records all the dependencies included in the starter repo.