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?
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.
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',
});This project's static Pages are built by GitLab CI, following the steps
defined in .gitlab-ci.yml
To work locally with this project, you'll have to follow the steps below:
- Fork, clone or download this project
- Install dependencies:
npm install - Preview your project while making changes:
npm run start - Add content
- To simulate a static build, run
npm run build. This is not required. - Commit & push your changes. GitLab will tigger a static build as instructed by the
.gitlab-ci.yml
Read more at Astro's documentation.
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.
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.