JHipster 应用程序在开发模式下生成消息“this.driver.matchesElement”

Posted 2023-02-16

【中文标题】JHipster 应用程序在开发模式下生成消息“this.driver.matchesElement”

【英文标题】：JHipster Application produces message "this.driver.matchesElement" in dev mode

【发布时间】：2018-12-07 14:50:05

【问题描述】：

我在 Dev 中运行 JHipster 应用程序时遇到问题。有些开发者运行流畅，有些则显示消息“TypeError: this.driver.matchesElement is not a function”。所有计算机都有相同版本的 NPM、Yarn 和 Node。

节点版本：8.11.0 NPM 版本：5.6.0 纱线版本​​：1.7.0

前端应用 StackTrace：

ERROR TypeError: this.driver.matchesElement is not a function
    at TransitionAnimationEngine.processLeaveNode (browser.js?881a:3023)
    at TransitionAnimationEngine.flush (browser.js?881a:3059)
    at InjectableAnimationEngine.AnimationEngine.flush (browser.js?881a:3896)
    at eval (animations.js?063e:363)
    at ZoneDelegate.invoke (zone.js?6524:388)
    at Zone.run (zone.js?6524:138)
    at NgZone.runOutsideAngular (core.js?593e:4681)
    at AnimationRendererFactory.end (animations.js?063e:361)
    at DebugRendererFactory2.end (core.js?593e:15096)
    at ViewRef_.detectChanges (core.js?593e:11563)
defaultErrorLogger

包.json：

  ...
  "cacheDirectories": [
    "node_modules"
  ],
  "dependencies": 
    "@angular/animations": "^6.0.4",
    "@angular/common": "5.2.0",
    "@angular/compiler": "5.2.0",
    "@angular/core": "5.2.0",
    "@angular/forms": "5.2.0",
    "@angular/platform-browser": "5.2.0",
    "@angular/platform-browser-dynamic": "5.2.0",
    "@angular/router": "5.2.0",
    "@ng-bootstrap/ng-bootstrap": "1.0.0",
    "bootstrap": "4.0.0",
    "core-js": "2.4.1",
    "font-awesome": "4.7.0",
    "jquery": "3.2.1",
    "ng-jhipster": "0.4.0",
    "ngx-cookie": "2.0.1",
    "ngx-infinite-scroll": "0.5.1",
    "ngx-webstorage": "2.0.1",
    "primeng": "5.2.7",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.5.6",
    "swagger-ui": "2.2.10",
    "tether": "1.4.0",
    "zone.js": "0.8.19",
    "ngx-image-cropper": "0.2.8"
  ,
  "devDependencies": 
    "@angular/cli": "1.6.6",
    "@angular/compiler-cli": "5.2.0",
    "@ngtools/webpack": "1.8.5",
    "@types/fullcalendar": "3.8.0",
    "@types/jasmine": "2.5.53",
    "@types/node": "8.0.18",
    "@types/quill": "^1.3.3",
    "angular2-template-loader": "0.6.2",
    "awesome-typescript-loader": "3.2.2",
    "browser-sync": "2.18.13",
    "browser-sync-webpack-plugin": "1.2.0",
    "codelyzer": "4.0.1",
    "copy-webpack-plugin": "4.2.3",
    "css-loader": "0.28.4",
    "exports-loader": "0.6.4",
    "extract-text-webpack-plugin": "3.0.2",
    "file-loader": "1.1.5",
    "fullcalendar": "3.9.0",
    "generator-jhipster": "4.14.4",
    "html-loader": "0.5.0",
    "html-webpack-plugin": "2.30.1",
    "jasmine-core": "2.7.0",
    "karma": "1.7.1",
    "karma-chrome-launcher": "2.2.0",
    "karma-coverage": "1.1.1",
    "karma-intl-shim": "1.0.3",
    "karma-jasmine": "1.1.0",
    "karma-junit-reporter": "1.2.0",
    "karma-notify-reporter": "1.0.1",
    "karma-phantomjs-launcher": "1.0.4",
    "karma-remap-istanbul": "0.6.0",
    "karma-sourcemap-loader": "0.3.7",
    "karma-webpack": "2.0.4",
    "merge-jsons-webpack-plugin": "1.0.11",
    "phantomjs-prebuilt": "2.1.16",
    "proxy-middleware": "0.15.0",
    "quill": "^1.3.2",
    "rimraf": "2.6.1",
    "source-map": "0.6.1",
    "sourcemap-istanbul-instrumenter-loader": "0.2.0",
    "style-loader": "0.18.2",
    "to-string-loader": "1.1.5",
    "tslint": "5.5.0",
    "tslint-loader": "3.5.3",
    "typescript": "2.6.2",
    "uglifyjs-webpack-plugin": "1.1.5",
    "web-app-manifest-loader": "0.1.1",
    "webpack": "3.10.0",
    "webpack-dev-server": "2.9.5",
    "webpack-merge": "4.1.1",
    "webpack-notifier": "1.5.1",
    "webpack-visualizer-plugin": "0.1.11",
    "workbox-webpack-plugin": "3.0.0-beta.1",
    "write-file-webpack-plugin": "4.1.0",
    "xml2js": "0.4.17"
  ,
  "engines": 
    "node": ">=6.9.0"
  ,
  ...

谢谢。

【问题讨论】：

什么操作系统？

Linux Fedora 27

我找到了解决方案。这是 6.0.4 版本的角度动画的问题。我将项目更新到版本 6.0.6 并更正了所有依赖项警告。它现在工作正常

谢谢@Braulio。在我的情况下，从 6.0.7 降级到 6.0.5 对我有用。我在我的角度应用程序中遇到了与 6.0.7 版本相同的错误（TypeError：this.driver.matchesElement 不是函数）。 npm install @angular/animations@6.0.5 --save

我在 Mac 上运行，我仍然遇到问题。

【参考方案1】：

这是 6.0.4 版本的角度动画的问题。我将项目更新到版本 6.0.6 并更正了所有依赖项警告。现在可以正常使用了

【参考方案2】：

所以我们遇到了一个问题，system.js 文件定义了要使用的版本，但 package.json 文件获得了最新版本。这导致前端出现问题。

在我们从 system.js 中删除版本之后，它很高兴。