angularangular-cliangular11angular-json

Cannot set fileReplacements to replace folder content with Angular 11


I'm using the angular cli config fileReplacements in angular.json file to replace a folder content, like this:

{
  "projects": {
    "myProject": {
      "architect": {
        "build": {
          "configurations": {
            "prod": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                },
                {
                  "replace": "node_modules/moment/locale/",
                  "with": "src/moment-js-locale/"
                }
              ]
            }
          }
        }
      }
    }
  }
}

Notice that in replace value I'm using a path to a folder instead of a path to a file. This is working code for Angular 10.

I upgraded to Angular 11 and now I'm getting an error when trying to build a prod version using this command: ng build --prod

The error I'm getting is:

Schema validation failed with the following errors:
  Data path ".fileReplacements[1]" should NOT have additional properties(replace).
  Data path ".fileReplacements[1].replace" should match pattern "\.(([cm]?j|t)sx?|json)$".
  Data path ".fileReplacements[1]" should match exactly one schema in oneOf.

ESLint is showing me this warning:

String does not match the pattern of "\.(([cm]?j|t)sx?|json)$".

What can I do with this? Is this an Angular 11 bug? should I use a different approach?

Any help will be appreciated.


Solution

  • So it turns out that this feature was in fact a Bug 🙂 The fact that one could make a folder replacement till Angular 10 wasn't supposed to work from the beginning.

    I asked this question in angular-cli repo and this was the answer that I got:

    I am sorry that you are experiencing this issue after updating. However, replacing directories was never a supported use-case of the file replacements feature.

    I guess that this will need to be handled by the developer. In my case I just added a script to do that with shell command and I'm running this script as a pre build script using npm run script.