The callback was already called - css-loader - Angular

Question

I am getting this error while deploying the project to google cloud. It is working fine on my local end but when I try to deploy the project it occurs.

Step #0 - "Build": [0m[91mCompiling ngx-material-file-input : es2015 as esm2015

Step #0 - "Build": [0m[91mCompiling ngx-toastr : es2015 as esm2015

Step #0 - "Build": [0m[91m/ng-app/node_modules/loader-runner/lib/LoaderRunner.js:106 Step #0 - "Build": throw new Error("callback(): The callback was already called.");

Step #0 - "Build": ^

Step #0 - "Build": Step #0 - "Build": Error: callback(): The callback was already called. Step #0 - "Build": at context.callback (/ng-app/node_modules/loader-runner/lib/LoaderRunner.js:106:10)

Step #0 - "Build": at /ng-app/node_modules/@angular-devkit/build-angular/node_modules/css-loader/dist/index.js:137:5

Step #0 - "Build": at processTicksAndRejections (node:internal/process/task_queues:96:5)

Step #0 - "Build":

Step #0 - "Build": Node.js v17.1.0

Step #0 - "Build": The command '/bin/sh -c npm run ng build -- --prod --output-path=dist' returned a non-zero code: 1 Finished Step #0 - "Build" ERROR ERROR: build step 0 "gcr.io/cloud-builders/docker" failed: step exited with non-zero status: 1

Step #0 - "Build": [0m

Here is the image

Answer 1

I resolved this issue. The issue was the typescript was updating automatically to the latest version which added a conflict between angular and typescript versions which resulted in this error on GCP.

Solution: Add this in the tsconfig.json file and then try again

"angularCompilerOptions": {
    "disableTypeScriptVersionCheck": true,
  }