Ignore a path in the root RouterModule

Question

I am using Angular 9. I have a JSON file in the root directory that I do not want included in the app. In other words:

/src
  |-- /app
  |-- /assets
  |-- index.html
  |-- do_not_include_this_file.json

This means http://example.com/do_not_include_this_file.json should be ignored by the RouterModule and instead go straight to the file. Currently that path will redirect to a PageNotFoundComponent, e.g.

export const APP_ROUTER_PROVIDERS: Routes = [
    { path: 'login', component: LoginComponent },
    { path: '', redirectTo: '/login', pathMatch: 'full' },
    { path: '**', component: PageNotFoundComponent }
];

How can I get the RouterModule to completely ignore a path?

Answer 1

You can serve "do_not_include_this_file.json" as a static file from your root directory.

Check the root directory of your Angular application for a file called "angular.json". In "angular.json", you can use the assets entities. Any files or directories you include in the asset value array will be served statically. Add your static file here. When enabled, all of these files will also be served in a production environment / copied to the dist directory.

Following code assumes you have "do_not_include_this_file.json" in your src folder and serves it to root directory in output.

"projects": {
  "YourProject": {
      "root": "",
      ...
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            ...
            "assets": [
              ...
              {
                "glob": "do_not_include_this_file.json",
                "input": "src/",
                "output": "/"
              },
              ...
            ]

Here is a page for more information; https://angular.io/guide/workspace-config#asset-config