Angular keep recompiling even when nothing change

I have an Angular application that compile again and again while nothing changes.
We didn’t changed the webpack config.

Running the app with ng serve --watch --poll 1000 do not fixed the problem.

In the node_modules/@angular-devkit/build-angular/src/tools/webpack/configs/common.js I’ve add this code to display the change detected by webpack:

const extraPlugins = [
      new (class {
        apply(compiler) {
                  compiler.hooks.watchRun.tap(
                        "WatchRunPlugin",
                        ({ modifiedFiles, removedFiles }) => {
                          console.log({ modifiedFiles, removedFiles });
                        }
                  );
                }
      })()
    ];

And I have this in the logs:

⠋ Generating browser application bundles...{
  modifiedFiles: Set(1) { '<project_root_directory>' },
  removedFiles: Set(0) {}
}

Also this is our tsconfig.json file:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./src/app",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "importHelpers": true,
    "allowSyntheticDefaultImports": true,
    "target": "ES2022",
    "module": "es2020",
    "lib": [
      "es2018",
      "dom"
    ],
    "typeRoots": [
      "node_modules/@types"
    ],
    "useDefineForClassFields": false
  }
}

And tsconfig.app.json:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": []
  },
  "files": [
    "src/main.ts",
    "src/polyfills.ts"
  ],
  "include": [
    "src/**/*.d.ts"
  ]
}

Any idea on how to solve this problem ?

Leave a Comment