GitHub Pages site loads without CSS, or shows a blank page

Tell Astro the site's address and the repository name, so links and assets point at /REPO/. Leave out base if the repository is USERNAME.github.io or you use your own domain.

import { defineConfig } from 'astro/config';

export default defineConfig({
  site: 'https://USERNAME.github.io',
  base: '/REPO',
});

Set base to the repository name, with a slash on both ends. Leave it out if the repository is USERNAME.github.io or you use your own domain.

import { defineConfig } from 'vite';

export default defineConfig({
  base: '/REPO/',
  // keep your plugins (react(), vue(), svelte()...) here
});

Nothing to change: the workflow passes the right baseURL to Hugo when it builds.

Give the adapter a 404.html fallback and read the base path from the BASE_PATH variable the workflow sets.

sveltekit({
  adapter: adapter({ fallback: '404.html' }),
  paths: { base: process.env.BASE_PATH ?? '' },
}),

Nothing to change in the code: the workflow builds with Nuxt's github_pages preset and sets NUXT_APP_BASE_URL to the repository name.

Set url to the GitHub Pages address and baseUrl to the repository name, with slashes on both ends. Docusaurus recommends setting trailingSlash too.

url: 'https://USERNAME.github.io',
baseUrl: '/REPO/',
organizationName: 'USERNAME',
projectName: 'REPO',
trailingSlash: false,

Build with --base-href set to the repository name. The workflow also copies index.html to 404.html, so deep links open the app instead of GitHub's error page.

Add basePath with the repository name. Leave it out if the repository is USERNAME.github.io or you use your own domain.

const nextConfig = {
  output: 'export',
  images: { unoptimized: true },
  basePath: '/REPO',
};

Add a pathPrefix with the repository name. The workflow builds with --prefix-paths so Gatsby uses it.

module.exports = {
  pathPrefix: '/REPO',
  // ...your siteMetadata and plugins
};

The workflow builds with --pathprefix set to the repository name. For it to reach your links, write them with Eleventy's url filter: {{ '/about/' | url }}.

Nothing to change: the workflow passes the right baseurl. In your templates, use {{ site.baseurl }} or the relative_url filter for links.

Add a homepage field to package.json with the full address, so the build points at /REPO/.

"homepage": "https://USERNAME.github.io/REPO",

Set site_url to the GitHub Pages address. MkDocs writes relative links, so the subfolder works either way, but the sitemap and canonical links use site_url.

site_url: https://USERNAME.github.io/REPO/

Set base to the repository name, with a slash on both ends.

export default {
  base: '/REPO/',
  // ...title, themeConfig
};