Repo Structure (< PagesJS 1.0.0) | 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.

Note

This directory must not contain any subdirectories.

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 starters include 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.

Back

< Repo Structure

Templates >

Feedback

<% elem.innerText %>