Fix 404 - page not found routing errors in netlify Angular apps

January 1, 0001

Problem

404 - page not found routing errors in netlify Angular apps

Solution

In Angular 6

  • add a _redirects file under src folder
  • add the following contents:
/*  /index.html 200
  • Open angular.json and append the assets section with "src/_redirects", for example:
"projects": {
    "ng-universal-demo": {
      "root": "",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist/browser",
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "src/tsconfig.app.json",
            "polyfills": "src/polyfills.ts",
            "assets": [
              "src/_redirects",
              {
                "glob": "**/*",
                "input": "src/assets",
                "output": "/assets"
              },
  • push your changes and redeploy