Hi there! I've just installed a fresh copy of Astro (v9.8.1, empty template). I created a new <a> tag in my index page with a link to about like so: <a href="/about">. I ran npm run build and it produced the exact same link. So in my astro.config.js I setup site: "https://example.com" and ran build again.... However, the links are still relative links, not full ones. By the documentation and research, I was led to believe setting site would produce canonical, full-URLS for all my links. What do I do now?
#Links not using "site" on build
icy tulip
idle crescentBOT
Hi @icy tulip. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
The site configuration in astro.config.mjs is used for generating the sitemap and creating canonical URLs in your components via Astro.site. However, it does not automatically convert relative URLs in your Astro components to absolute URLs. This is why you're still seeing relative URLs in your built HTML files even after setting the site configuration.
If you want to create absolute URLs in your Astro components, you can use Astro.site in your components. For example, you can create a link like this:
<a href={`${Astro.site}/about`}>About</a>
This will generate an absolute URL based on the site configuration in your astro.config.mjs.
If you want to host your Astro site at a subpath, you can use the base configuration in astro.config.mjs. This is useful when you're deploying your site to a GitHub Pages repository, for example. When you set a base value, all of your internal page links must be prefixed with your base value. For example:
<a href="/my-repo/about">About</a>
This will generate a URL like <https://<username>.github.io/my-repo/about.>
Please note that Astro uses file-based routing, so the URLs of your pages are based on the file layout of your src/pages/ directory. When you add a file to the src/pages/ directory, a new route is automatically created for you.
Sources:
- Github Issue (closed): Config's site option not change <astro-island> component-url > Comments (https://github.com/withastro/astro/issues/5043)
- Github Issue (closed): Resolve confusion around Astro.canonicalURL and Astro.site > Original post (https://github.com/withastro/astro/issues/3618)
- Documentation > En > Guides > Deploy > Deploy your Astro Site to GitHub Pages > Configure Astro for GitHub Pages > Deploying to a
github.ioURL (https://docs.astro.build/en/guides/deploy/github/#deploying-to-a-githubio-url) - Documentation > En > Guides > Routing (https://docs.astro.build/en/guides/routing/#_top)