Search code examples
javascriptangulartypescriptangular-routing

How to run your project without hash in Angular

I have an Angular project which is running for almost 4 years and in this project we used hash(#) in the routing part, now for some reason the hash(#) needs to be removed.

In this part, I removed the config useHash that I had previously given to routing enter image description here

Now my project works as expected without # and there is no problem, and it also moves between the links correctly

But as soon as my page is refreshed, no page comes up and no request goes to the server, only a series of errors appear in the console and NetWork.

netWork errors :

console errors : enter image description here

Solution

  • When your network tab in localhost is having errors for the js files its usually due to the base href in the index.html not being set properly, could you try setting the tag as.

    <head>
  <meta charset="utf-8">
  <title>AngularTourOfHeroes</title>
  <base href="/"> <!-- this line should be set, you can ignore the others here -->
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>