Googlebot doesn't see links in Angular SPA because routerLink is rendered with an href starting with a hash

Question

In my Angular SPA (Single Page App), I have links like:

<a routerLink="/en/my-page" ...

When I check it in Google Search Console, I'm finding that Googlebot sees the link as:

<a href="#/en/my-page" ...

It seems that Googlebot can't follow such links and therefore can't see my-page.

Answer 1

That's a common JavaScript / SEO problem. It can happen with all JavaScript frameworks.

To make your website compatible with Google (and benefit from SEO), you might use the Server Side Rendering (SSR) method. Once that's done, Google will be able to crawl your website like a typical HTML website.

Answer 2

Check if you have { useHash: true } config in your Router configuration. If you do, just remove it, and that should solve the problem.

Before:

RouterModule.forRoot(routes, { useHash: true });

Now:

RouterModule.forRoot(routes);