ngx--角8中的转轴设置产生了误差。

Question

我遵循这指南，在我的角度8应用程序中设置滑动器。

在将NgxUsefulSwiperModule导入到app.module.ts中时，会出现以下错误

找不到./node_modules/ngx-useful-swiper/fesm2015/ngx-useful-swiper.js模块中的错误:错误:无法解决'C:\Users\Dan\NewAngular\node_modules\ngx-useful-swiper\fesm2015'中的“刷/包”问题

我尝试删除node_modules文件夹并重新安装所有内容，但每次都失败。

有人能告诉我我做错了什么吗？

这是我的package.json文件

{
  "name": "angular",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --ssl",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "run:prod": "ng build --prod",
    "test-single-run": "ng test --watch=false"
  },
  "private": true,
  "dependencies": {
    "@aleesaan/ng-scrollspy": "^1.0.2",
    "@angular/animations": "^8.2.14",
    "@angular/cdk": "^8.2.3",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "^8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/material": "^8.2.3",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/pwa": "^0.1000.0",
    "@angular/router": "~8.2.14",
    "@angular/service-worker": "~8.2.14",
    "@auth0/angular-jwt": "^4.0.0",
    "@iplab/ngx-file-upload": "^1.5.4",
    "@kolkov/angular-editor": "^1.1.5",
    "@microsoft/applicationinsights-web": "^2.0.0",
    "@nebular/eva-icons": "^4.6.0",
    "@nebular/theme": "^4.6.0",
    "@ng-bootstrap/ng-bootstrap": "^5.2.2",
    "@ng-select/ng-select": "^3.7.2",
    "@nicky-lenaers/ngx-scroll-to": "^9.0.0",
    "@thisissoon/angular-inviewport": "^4.2.2",
    "@thisissoon/angular-scrollspy": "^2.2.0",
    "angular-animations": "0.0.10",
    "angular-crumbs": "^3.0.1",
    "angular-scroll": "^1.0.2",
    "angular2-csv": "0.2.5",
    "angular2-jwt": "^0.2.3",
    "bootstrap": "^4.4.1",
    "bs4-toast": "^0.7.1",
    "classlist.js": "^1.1.20150312",
    "cors": "^2.8.5",
    "eva-icons": "^1.1.3",
    "font-awesome": "^4.7.0",
    "guid-typescript": "^1.0.9",
    "jquery": "^3.5.1",
    "jwt-decode": "^2.2.0",
    "microsoft-adal-angular6": "^1.3.0",
    "moment": "^2.27.0",
    "nebular-icons": "^1.1.0",
    "ng-click-outside": "^7.0.0",
    "ng-material-multilevel-menu": "^5.5.3",
    "ng-otp-input": "^1.7.7",
    "ng-pick-datetime": "^7.0.0",
    "ng-recaptcha": "^5.0.0",
    "ng-scroll-spy": "^1.0.1",
    "ng-sidebar": "^9.2.1",
    "ng-whiteboard": "^1.4.5",
    "ng2-completer": "^2.0.8",
    "ng2-google-charts": "^6.1.0",
    "ng2-smart-table": "1.5.0",
    "ng2-truncate": "^1.3.17",
    "ng5-slider": "^1.2.4",
    "ngx-chips": "^1.9.8",
    "ngx-drag-drop": "^2.0.0",
    "ngx-infinite-scroll": "^10.0.1",
    "ngx-logger": "4.2.0",
    "ngx-perfect-scrollbar": "^8.0.0",
    "ngx-quill": "^5.2.0",
    "ngx-scrollspy": "^1.2.1",
    "ngx-skeleton-loader": "2.6.1",
    "ngx-ui-loader": "^7.2.2",
    "ngx-useful-swiper": "^10.0.1",
    "pdfmake": "^0.2.0",
    "popper.js": "^1.16.1",
    "primeicons": "^2.0.0",
    "primeng": "^9.1.0",
    "quill": "^1.3.7",
    "quill-delta": "^4.1.0",
    "quill-emoji": "^0.1.4",
    "quill-mention": "^2.0.4",
    "roboto-fontface": "^0.10.0",
    "rxjs": "~6.4.0",
    "swiper": "^7.0.8",
    "tslib": "^1.13.0",
    "web-animations-js": "^2.3.2",
    "windows-10-icons": "^1.0.1",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.803.29",
    "@angular/cli": "^8.3.29",
    "@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.10.64",
    "@types/swiper": "^5.4.3",
    "codelyzer": "^5.2.1",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^5.2.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-edge-launcher": "^0.4.2",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.5.2",
    "ng2-mock-component": "^0.2.0",
    "protractor": "^7.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "3.5.3",
    "webpack": "^4.44.2"
  }
}

Answer 1

看起来ngx-useful-swiper与swiper的最新版本不兼容。

错误明确地指出，ngx-useful-swiper试图访问您刚刚安装的swiper包中不可用的文件。

尝试安装不同版本的swiper滑块。

遵循以下步骤：

1)卸载当前的刷卡

npm uninstall swiper

2)安装旧版本

npm install swiper@6.8.1

这应该能起作用。

Answer 2

试着安装ngx-swiper-wrapper.它是建立在刷卡和完美的工作与角度。

下面是npm页面的npm包装器(这个页面有一个初始的安装文档)：

https://www.npmjs.com/package/ngx-swiper-wrapper