node.js - Error: Emit attempted before Angular Webpack plugin initialization - Stack Overflow

admin管理员组

文章数量:1125548

I have an angular app and recently it started giving the error mentioned below. I tried to research online but there is minimal information on the web on this issue. I have tried disabling ivy and aot, installing a newer version of typescript, update my node and npm version, remove @ngtools-webpack from package.json, remove node_modules and package.lock.json and run npm i again, as well as all the posts mentioned below but had no luck. Ont thing I did notice that may be a problem is the angular-responsive-carousel.

We upgraded from angular 12 to angular 13 and then to 14. If any other file is needed, let me know.

my package.json is:

{
  "name": "DineNGo",
  "version": "2.0.0",
  "browser": {
    "fs": false,
    "path": false,
    "os": false
  },
  "scripts": {
    "ng": "ng",
    "main": "server.js",
    "heroku-postbuild": "ng build DineNGo --configuration=${ENV}",
    "preinstall": "npm install --location=global @angular/cli @angular/compiler-cli --legacy-peer-deps",
    "start": "set NODE_OPTIONS=--openssl-legacy-provider && ng serve",
    "build": "ng build --configuration production",
    "cypress:open": "cypress open",
    "swagger": "node ./swagger.js",
    "cypress:run": "cypress run",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/build-angular": "^14.2.13",
    "@angular/animations": "^14.3.0",
    "@angular/cdk": "^14.2.7",
    "@angular/cli": "^14.2.13",
    "@angular/common": "^14.3.0",
    "@angular/compiler": "^14.3.0",
    "@angular/compiler-cli": "^14.3.0",
    "@angular/core": "^14.3.0",
    "@angular/flex-layout": "^14.0.0-beta.40",
    "@angular/forms": "^14.3.0",
    "@angular/language-service": "^14.3.0",
    "@angular/localize": "^14.3.0",
    "@angular/material": "^14.2.7",
    "@angular/platform-browser": "^14.3.0",
    "@angular/platform-browser-dynamic": "^14.3.0",
    "@angular/router": "^14.3.0",
    "@capacitor/android": "^5.7.0",
    "@capacitor/app": "5.0.7",
    "@capacitor/core": "^5.7.0",
    "@capacitor/dialog": "^5.0.7",
    "@capacitor/haptics": "5.0.7",
    "@capacitor/ios": "5.7.0",
    "@capacitor/keyboard": "5.0.8",
    "@capacitor/preferences": "^5.0.7",
    "@capacitor/status-bar": "5.0.7",
    "@capgo/capacitor-updater": "^5.9.0",
    "@ng-bootstrap/ng-bootstrap": "^14.0.0",
    "@ngtools/webpack": "^14.2.13",
    "@ngx-translate/core": "^14.0.0",
    "@ngx-translate/http-loader": "^7.0.0",
    "@types/chart.js": "^2.7.42",
    "@types/chartist": "^0.9.38",
    "@types/crypto-js": "^3.1.47",
    "@types/express": "^4.17.0",
    "@types/googlemaps": "^3.43.3",
    "@types/jasmine": "~2.8.22",
    "@types/jasminewd2": "~2.0.3",
    "@types/lodash": "4.14.135",
    "@types/node": "^11.15.54",
    "@types/socket.io": "^3.0.2",
    "@types/socket.io-client": "^3.0.0",
    "@types/uuid": "^8.3.0",
    "@types/w3c-web-usb": "^1.0.10",
    "@types/web-bluetooth": "0.0.4",
    "angular-bootstrap-md": "^14.0.0",
    "angular-cc-library": "^2.1.2",
    "angular-cli-ghpages": "^0.6.2",
    "angular-notifier": "^11.0.0",
    "angular-responsive-carousel": "^2.1.2",
    "angularx-qrcode": "^16.0.0",
    "apexcharts": "^3.44.0",
    "axios": "^1.6.1",
    "bcryptjs": "^2.4.3",
    "body-parser": "^1.18.3",
    "bootstrap": "^5.3.3",
    "chart.js": "^2.9.4",
    "chartist": "^0.11.4",
    "clover-ecomm-sdk": "^1.0.0",
    "config": "^3.3.6",
    "core-js": "^2.5.4",
    "cors": "^2.8.5",
    "cron": "^3.1.6",
    "crypto": "^1.0.1",
    "crypto-js": "^4.2.0",
    "dotenv": "^6.1.0",
    "exec": "^0.2.1",
    "express": "^4.18.1",
    "express-jwt": "^8.4.1",
    "express-subdomain": "^1.0.6",
    "font-awesome": "^4.7.0",
    "fontawesome": "^5.6.3",
    "fs": "^0.0.1-security",
    "googlemaps": "^0.1.5",
    "got": "^11.8.1",
    "hammerjs": "^2.0.8",
    "jsonwebtoken": "^9.0.2",
    "jwt-decode": "^3.1.2",
    "lodash": "^4.17.21",
    "luxon": "^3.4.4",
    "lz-string": "^1.5.0",
    "material-dashboard": "^2.1.0",
    "material-design-icons": "^3.0.1",
    "material-design-lite": "^1.3.0",
    "mdbootstrap": "^4.19.2",
    "moment": "^2.30.1",
    "mongodb": "^3.0.10",
    "mongoose": "^8.9.3",
    "mongoose-to-swagger": "^1.5.1",
    "ng-apexcharts": "1.7.4",
    "ng-chartist": "^7.1.4",
    "ng-image-slider": "^6.1.0",
    "ng-multiselect-dropdown": "^0.2.14",
    "ng-otp-input": "^1.9.3",
    "ng-socket-io": "^0.2.4",
    "ngx-autosize": "^2.0.4",
    "ngx-bootstrap": "^10.0.0",
    "ngx-device-detector": "^2.0.0",
    "ngx-guided-tour": "^2.0.1",
    "ngx-infinite-scroll": "^14.0.1",
    "ngx-material-timepicker": "^13.1.1",
    "ngx-swiper-wrapper": "^10.0.0",
    "ngx-toastr": "11.1.1",
    "ngx-virtual-scroller": "^4.0.3",
    "openai": "^4.17.4",
    "path": "^0.12.7",
    "popper.js": "^1.15.0",
    "postcss": "^8.4.14",
    "request-promise": "^4.2.2",
    "resize-base64": "^1.0.12",
    "rootpath": "^0.1.2",
    "rxjs": "^6.6.7",
    "rxjs-compat": "^6.3.3",
    "simple-keyboard": "^3.7.65",
    "socket.io": "^4.6.2",
    "socket.io-client": "^4.6.2",
    "swagger-ui-express": "^5.0.0",
    "telnyx": "^1.26.0",
    "ts-node": "6.0.0",
    "tslib": "^1.9.0",
    "uuid": "^3.3.2",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/core": "^14.2.13",
    "@angular-devkit/schematics": "^14.2.13",
    "@capacitor/cli": "^5.7.0",
    "@types/google.maps": "^3.58.1",
    "codelyzer": "^0.0.28",
    "cypress": "^13.5.0",
    "cypress-cucumber-preprocessor": "^4.3.1",
    "cypress-multi-reporters": "^1.6.0",
    "eslint-plugin-cypress": "^2.10.3",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^6.4.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.0",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "ng2-charts-schematics": "^0.1.7",
    "protractor": "^3.3.0",
    "swagger-autogen": "^2.23.7",
    "swiper": "^8.4.7",
    "tslint": "~6.1.3",
    "typescript": "~4.7.0"
  },
  "engines": {
    "node": "18.18.2",
    "npm": "9.8.0"
  }
}

my angular.json:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "DineNGo": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {
        "@schematics/angular:component": {
          "style": "scss"
        }
      },
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "allowedCommonJsDependencies": ["crypto-js", "@aws-sdk/eventstream-marshaller", "buffer", "js-cookie",
              "@aws-crypto", "zen-observable", "@aws-sdk/util-utf8-node", "@aws-crypto/sha256-js", "@aws-sdk/util-buffer-from",
              "@aws-sdk/smithy-client", "@aws-sdk/middleware-serde", "@aws-sdk/middleware-user-agent",
              "@aws-sdk/middleware-retry", "@aws-sdk/middleware-signing", "@aws-sdk/middleware-content-length",
              "@aws-sdk/middleware-host-header", "@aws-sdk/config-resolver", "@aws-sdk/s3-request-presigner",
              "@aws-sdk/util-format-url", "@aws-sdk/util-create-request", "@aws-sdk/property-provider",
              "axios", "@aws-sdk/fetch-http-handler", "@aws-sdk/protocol-http", "@aws-sdk/querystring-builder",
              "@aws-sdk/util-utf8-browser", "@aws-sdk/url-parser-browser", "@aws-crypto/sha256-browser",
              "@aws-sdk/url-parser-node", "@aws-sdk/util-uri-escape", "@aws-sdk/middleware-sdk-s3",
              "@aws-sdk/middleware-bucket-endpoint", "@aws-sdk/querystring-parser", "@aws-sdk/middleware-apply-body-checksum",
              "@aws-sdk/middleware-ssec", "@aws-sdk/middleware-expect-continue", "fast-xml-parser",
              "@aws-sdk/xml-builder", "@aws-sdk/md5-js", "@aws-sdk/hash-blob-browser",
              "@aws-sdk/eventstream-serde-browser", "@aws-sdk/middleware-location-constraint", "uuid",
              "@aws-sdk/credential-provider-cognito-identity", "@aws-sdk/eventstream-serde-config-resolver",
              "ulid", "zen-push", "lodash", "@aws-amplify/core", "url", "@aws-crypto/crc32", "isomorphic-unfetch",
              "crypto-js/lib-typedarrays", "crypto-js/hmac-sha256", "crypto", "rxjs",  "angularx-qrcode",
              "qrcode", "chart.js", "apexcharts", "remote-pay-cloud-api"
            ],
            "outputPath": "dist/DineNGo",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/assets/TOMS4.png",
              "src/assets",
              "src/assets/i18n",
              "src/.well-known/assetlinks.json"
            ],
            "styles": [
              "./node_modules/bootstrap/dist/css/bootstrap.min.css",
              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
              "./node_modules/chartist/dist/chartist.css",
              "./node_modules/material-dashboard/assets/css/material-dashboard.css",
              "./node_modules/simple-keyboard/build/css/index.css",
              "src/styles.scss"
            ],
            "scripts": [
              "node_modules/bootstrap/dist/js/bootstrap.min.js",
              "node_modules/chart.js/dist/Chart.js",
              "node_modules/hammerjs/hammer.min.js",
              "node_modules/popper.js/dist/umd/popper.min.js"
            ],
            "aot": false,
            "vendorChunk": true,
            "extractLicenses": false,
            "buildOptimizer": false,
            "sourceMap": true,
            "optimization": false,
            "namedChunks": true
          },
          "configurations": {
            "production": {
              "budgets": [
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "10kb"
                }
              ],
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": false
            },
            "dev": {
              "budgets": [
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "10kb"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": false
            }
          },
          "defaultConfiguration": ""
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "DineNGo:build",
            "disableHostCheck": true,
            "proxyConfig": "proxy.conf.json"

          },
          "configurations": {
            "production": {
              "browserTarget": "DineNGo:build:production"
            },
            "dev": {
              "browserTarget": "DineNGo:build:dev"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "DineNGo:build"
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.spec.json",
            "karmaConfig": "src/karma.conf.js",
            "styles": [
              "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
              "node_modules/angular-bootstrap-md/assets/scss/bootstrap/bootstrap.scss",
              "src/styles.scss"
            ],
            "scripts": [],
            "assets": [
              "src/assets/TOMS4.png",
              "src/assets",
              "src/assets/default-logo.png"

            ]
          }
        }
      }
    },
    "DineNGo-e2e": {
      "root": "e2e/",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "e2e/protractor.conf.js",
            "devServerTarget": "DineNGo:serve"
          },
          "configurations": {
            "production": {
              "devServerTarget": "DineNGo:serve:production"
            },
            "dev": {
              "devServerTarget": "DineNGo:serve:production"
            }
          }
        }
      }
    }
  },
  "schematics": {
    "@schematics/angular:component": {
      "style": "scss"
    }
  },
  "cli": {
    "analytics": false
  }
}

and my tsconfig.json is:

{
  "compileOnSave": false,
  "compilerOptions": {
    "paths": {
      "@angular/*": ["./node_modules/@angular/*"],
      "swiper_angular": ["./node_modules/swiper/angular"]
    },
    "baseUrl": "./",
    "downlevelIteration": true,
    "module": "esnext",
    "types": [],
    "outDir": "./dist/out-tsc",
    "skipLibCheck": true,
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "target": "es2020",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "es2020",
      "ESNext",
      "dom",
    ]
  }
}

the errors are: `./src/main.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js): Error: Emit attempted before Angular Webpack plugin initialization.

./src/polyfills.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js): Error: Emit attempted before Angular Webpack plugin initialization.

Error: Failed to initialize Angular compilation - The target entry-point "ngx-toastr" has missing dependencies:

• @angular/compiler/src/core `

some other things I tried: Emit attempted before Angular Webpack plugin initialization Error: Module build failed - Angular migration to 14.2.2 Emit attempted before Angular Webpack plugin initialization after webpack5 build

本文标签： nodejsError Emit attempted before Angular Webpack plugin initializationStack Overflow