ERROR in Node does not exist: C:/volaris-web/node_modules/ngx-swiper-wrapper

I have an Angular 8 project. These all are configurations in my system.

Node :- v14.17.0,
npm -v :- 6.14.8,
Angular CLI:- 8.3.23

There is no error at the time of compilation.

But getting this error at runtime. I have not done any migration and updation.

enter image description here

For solving this error I just enable Ivy ("enableIvy": true) after that I found a more precise description of the exact error.

enter image description here

Here's package.json:

"ngx-swiper-wrapper": "^8.0.2",

To resolve the "ngx-swiper-wrapper" package error. I upgraded the version to the highest (10.0.0). but after upgrading it's giving more errors at compile time. I tried a lot but could not find any solution yet.

Note:- And not experiencing this error in all systems. in my other system, it's working fine. I am not sure the cause of the issue.

How do I resolve this error?
Any advice will be helpful.

Thanks

1 answer

  • answered 2021-05-15 14:05 Aakankshi Gupta

    Just for reference.

    package.json file:

     "private": true,
      "dependencies": {
        "@angular/animations": "~8.2.9",
        "@angular/cdk": "~8.2.3",
        "@angular/common": "~8.2.9",
        "@angular/compiler": "~8.2.9",
        "@angular/core": "~8.2.9",
        "@angular/forms": "~8.2.9",
        "@angular/material": "^8.2.3",
        "@angular/material-moment-adapter": "^8.2.3",
        "@angular/platform-browser": "~8.2.9",
        "@angular/platform-browser-dynamic": "~8.2.9",
        "@angular/router": "~8.2.9",
        "@ncstate/sat-popover": "^4.0.0",
        "@ngmodule/material-carousel": "^0.5.1",
        "angular-google-recaptcha": "^1.0.3",
        "angular-user-idle": "^2.2.1",
        "card-validator": "^6.2.0",
        "crypto-js": "3.1.9-1",
        "file-saver": "^2.0.2",
        "hammerjs": "^2.0.8",
        "moment": "^2.27.0",
        "moment-mini": "^2.24.0",
        "ngx-barcode": "^0.2.4",
        "ngx-captcha": "^8.0.1",
        "ngx-daterangepicker-material": "^2.1.10",
        "ngx-flickity": "0.0.9",
        "ngx-pagination": "^5.0.0",
        "ngx-swiper-wrapper": "^8.0.2",
        "rxjs": "~6.4.0",
        "tslib": "^1.10.0",
        "workbox-sw": "^4.3.1",
        "zone.js": "~0.9.1"
      },
      "devDependencies": {
        "@angular-devkit/build-angular": "^0.803.23",
        "@angular-devkit/build-ng-packagr": "^0.803.20",
        "@angular/cli": "^8.3.20",
        "@angular/compiler-cli": "^8.2.14",
        "@angular/language-service": "^8.2.14",
        "@types/jasmine": "~3.3.8",
        "@types/jasminewd2": "~2.0.3",
        "@types/node": "~8.9.4",
        "codelyzer": "^5.2.1",
        "jasmine-core": "~3.4.0",
        "jasmine-spec-reporter": "~4.2.1",
        "karma": "~4.1.0",
        "karma-chrome-launcher": "~2.2.0",
        "karma-coverage-istanbul-reporter": "~2.0.1",
        "karma-jasmine": "~2.0.1",
        "karma-jasmine-html-reporter": "^1.5.1",
        "ng-packagr": "^5.7.1",
        "prettier": "^1.19.1",
        "protractor": "~5.4.0",
        "ts-node": "~7.0.0",
        "tsickle": "^0.37.1",
        "tslint": "~5.15.0",
        "tslint-config-prettier": "^1.18.0",
        "typescript": "~3.5.3",
        "workbox-cli": "^4.3.1"
      }

    app.module.ts file

    import { APP_INITIALIZER, NgModule } from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    // shared
    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
    // core
    import { APPSETTINGS, CoreModule, RecaptchaConfig, RECAPTCHA_CONFIG_VOL } from '@volaris/core';
    import { NotificationBannerComponent } from '@volaris/shared';
    import { UserIdleModule } from 'angular-user-idle';
    import { AfterConfirmationGuard } from './after-confirmation.guard';
    // Routing
    import { AppRoutingModule } from './app-routing.module';
    // base component
    import { AppComponent } from './app.component';
    import { ComparisonComponent } from './comparison/comparison.component';
    import { MyProfileAuthGuard } from './my-profile-auth.guard';
    import { SharedMbsModule } from './shared-mbs/shared-mbs.module';
    import { WaitingRoomComponent } from './waiting-room/waiting-room.component';
    
    export const recaptchaInitializerFn = (config: any) => {
       return () => {
       RecaptchaConfig.siteKey = config.siteKey;
       return;
      }
    }
    @NgModule({
       declarations: [
          AppComponent,
          ComparisonComponent,
          WaitingRoomComponent
       ],
       providers: [
          RecaptchaConfig, {
             provide: APP_INITIALIZER,
             useFactory: recaptchaInitializerFn,
             multi: true,
             deps: [ RECAPTCHA_CONFIG_VOL ]
          },
          MyProfileAuthGuard,
          AfterConfirmationGuard
       ],
       imports: [
          BrowserModule,    
          BrowserAnimationsModule,
          CoreModule.forRoot(APPSETTINGS),
          UserIdleModule,  
          SharedMbsModule,
          AppRoutingModule
       ],
       exports: [
          NotificationBannerComponent
       ],
       bootstrap: [
          AppComponent
       ]
    })
    export class AppModule { }