---

Example Astro website using GitLab Pages.

Learn more about GitLab Pages at https://pages.gitlab.io and the official documentation https://docs.gitlab.com/ce/user/project/pages/.

---

• Project Structure
• Add base path in Astro when unique domain is disabled
• GitLab CI
• Building locally
• GitLab User or Group Pages
• Did you fork this project?

Project Structure

Inside your Astro project, you'll see the following folders and files:

/
├── static/
│   └── favicon.svg
├── src/
│   ├── layouts/
│   │   └── Layout.astro
│   └── pages/
│       └── index.astro
└── package.json

There’s nothing special about src/components/, but that’s where we like to put any Astro/React/Vue/Svelte/Preact components.

To learn more about the folder structure of an Astro project, refer to our guide on project structure.

Add base path in Astro when unique domain is disabled

If you disable the unique domain, the site will be hosted under yourname.gitlab.io/examplerepository/, you will need to configure Astro to use the base path.

In astro.config.mjs, the value for base should be your project’s name, starting with a forward slash - for example, /examplerepository. This ensures Astro understands that your website’s root is /examplerepository instead of the default /, especially when your project is hosted at https://gitlab.com/yourname/examplerepository/.

export default defineConfig({
    base: '/examplerepository',
});

GitLab CI

This project's static Pages are built by GitLab CI, following the steps defined in .gitlab-ci.yml

Building locally

To work locally with this project, you'll have to follow the steps below:

1. Fork, clone or download this project
2. Install dependencies: npm install
3. Preview your project while making changes: npm run start
4. Add content
5. To simulate a static build, run npm run build. This is not required.
6. Commit & push your changes. GitLab will tigger a static build as instructed by the .gitlab-ci.yml

Read more at Astro's documentation.

GitLab User or Group Pages

To use this project as your user/group website, you will need one additional step: just rename your project to namespace.gitlab.io, where namespace is your username or groupname. This can be done by navigating to your project's Settings.

Read more about user/group Pages and project Pages.

Did you fork this project?

If you forked this project for your own use, please go to your project's Settings and remove the forking relationship, which won't be necessary unless you want to contribute back to the upstream project.