Angular not replacing environment file when build

Question

I am trying to build my Ionic 5 project for production but the environment.ts file is not replaced with environment.prod.ts. There are lots of solutions available on the internet but non of that fixed it. Following is ng --version of my project.

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1002.1
@angular-devkit/build-angular   0.1002.0
@angular-devkit/core            10.2.0
@angular-devkit/schematics      10.2.1
@angular/cli                    10.2.1
@angular/fire                   5.4.2
@schematics/angular             10.2.1
@schematics/update              0.1002.1
rxjs                            6.5.5
typescript                      3.9.7

angular.json file has the following under configurations.

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

I have tried with both following imports.

import { environment } from 'src/environments/environment';

import {environment} from './../../../environments/environment';

I have run all the following commands.

ng build --prod
ng build --configuration=production
ng build --prod --configuration production
npm run ng build -- --prod

It runs successfully but the environment file is not replaced. I get the following warning message after the run.

WARNING in /Users/Myuser/TestProject/src/environments/environment.prod.ts is part of the TypeScript compilation but it's unused.
Add only entry points to the 'files' or 'include' properties in your tsconfig.

Answer 1

Use ionic build --prod instead of running ng build in an Ionic project. Adding ionic build command link for reference https://ionicframework.com/docs/cli/commands/build/