Question: Because of the way we are set up here, my local development environment (ng serve) is not the same as my production build environment( ng build --base-href="/path/" --prod. I'd like to use different index.html files for serve and build, with the build still generating the correct index.html.

If I change my angular.json, I get a message that property fileReplacements is not allowed. File replacement for ng serve seems simplest to maintain though.

```
"serve": {
  "configurations": {
    "production": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.prod.ts"
        }
      ],
    }
  }
}

```

This gives me an error that the property fileReplacements is not allowed in the serve section. Package.json has @angular/core ^8.0 and angular cli ~8.0.2.

Whenever I search for a solution, my results point me to the fileReplacements documentation, but that doesn't seem to work. The file isn't getting replaced. I know there are tons of other ways to do this, but I'd like to do it the approved angular.json way if possible.

Answer: 
I solved it using the --index flag for ng build, without using different folders by doing the following:

dev file

```
src/index-dev.html

```

production file

```
src/index.html

```

angular.json

```
"architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        "aot": true,
        "outputPath": "www",
        "index": "src/index-dev.html",
     }

```

cmd : 

```
ng build --prod --index=/src/index.html

```

For some reason --index only accepts index.html and no other filename in this solution.
Inside your `angular.json` file,

add an alternative index page to the production configuration for example:

`"index": "src/index.php"` to `projects.ClientApp.architect.build.configurations.production`:

```
{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "ClientApp": {
            "projectType": "application",
          + "schematics": {...},
            "root": "",
            "sourceRoot": "src",
            "prefix": "app",
            "architect": {
                "build": {
                    "builder": "@angular-devkit/build-angular:browser",
                    "options": {
                        "outputPath": "dist/client-app",
                        "index": "src/index.html", // <-- Default Index File for 'ng serve'
                        "main": "src/main.ts",
                        "polyfills": "src/polyfills.ts",
                        "tsConfig": "tsconfig.app.json",
                        "inlineStyleLanguage": "scss",
                      + "assets": [...],
                      + "styles": [...],
                        "scripts": []
                    },
                    "configurations": {
                        "production": // <-- PRODUCTION
                          + "budgets": [...],
                          + "fileReplacements": [...],
                            "index": "src/index.php", // <-- Index File for PRODUCTION
                            "outputHashing": "all",
                          + "optimization": {...}
                        },
                      + "development": {...}
                    },
                    "defaultConfiguration": "production"
                },
              + "serve": {...},
              + "extract-i18n": {...},
              + "test": {...},
              + "lint": {...}
            }
        }
    }
}

```

Then if you run the commands:

* `ng serve` (uses the **index.html** file. **Serves for development by default**)
* `ng build` (uses the **index.php** file. **Builds for production by default**)

To change the configuration for `ng serve` or `ng build`, add the configuration:

* `ng serve --configuration production` (Warning will show - ignore it, will serve the **index.php** file)
* `ng build --configuration development` (will build with the **index.html** file for development)