Reputation: 43

Angular templates in WebStorm 2020.3 show Unresolved pipes and variables after recent updates

We recently upgraded to Angular 12 and "typescript": "4.2.4". I use WebStorm 2020.3.

My template files suddenly fail to recognize pipes such as date or async and public component properties (that were previously recognized and I'm not the only member of my team impacted this way). But, the app compiles without issues.

This is my first time asking a question here. Any help is greatly appreciated.

package.json dependencies:

...
"dependencies": {
    "@angular/animations": "12.0.5",
    "@angular/common": "12.0.5",
    "@angular/compiler": "12.0.5",
    "@angular/core": "12.0.5",
    "@angular/forms": "12.0.5",
    "@angular/platform-browser": "12.0.5",
    "@angular/platform-browser-dynamic": "12.0.5",
    "@angular/router": "12.0.5",
    "@angular/upgrade": "12.0.5",
    "@cnvr/alerts": "2.5.0",
    "@cnvr/common": "0.6.0",
    "@cnvr/cuik": "4.26.0",
    "@cnvr/global-search": "4.2.0",
    "@iamadamjowett/angular-click-outside": "2.10.1",
    "@ngrx/effects": "10.0.0",
    "@ngrx/entity": "10.0.0",
    "@ngrx/store": "10.0.0",
    "@ngrx/store-devtools": "10.0.0",
    "ajv": "6.12.5",
    "ajv-keywords": "3.5.2",
    "core-js": "2.4.1",
    "cypress-localstorage-commands": "1.2.4",
    "cypress-plugin-tab": "1.0.5",
    "cypress-real-events": "1.3.0",
    "cypress-xpath": "1.6.1",
    "d3": "5.8.0",
    "d3-format": "3.0.1",
    "deep-diff": "1.0.2",
    "deep-equal": "1.0.1",
    "guid-typescript": "1.0.9",
    "istanbul": "0.4.5",
    "istanbul-instrumenter-loader": "3.0.1",
    "jquery": "2.2.4",
    "karma-junit-reporter": "2.0.1",
    "karma-phantomjs-launcher": "1.0.4",
    "karma-spec-reporter": "0.0.32",
    "latest": "0.2.0",
    "lodash": "4.17.21",
    "luxon": "1.26.0",
    "moment": "2.29.1",
    "moment-timezone": "0.5.12",
    "node-sass-asset-functions": "0.1.0",
    "npm": "6.14.11",
    "pako": "1.0.11",
    "pluralize": "7.0.0",
    "prettier": "1.18.2",
    "qrcode": "1.4.4",
    "rxjs": "6.6.3",
    "rxjs-tslint": "0.1.8",
    "source-map-explorer": "1.8.0",
    "ts-deepcopy": "0.1.4",
    "tslib": "2.0.0",
    "web-animations-js": "2.3.2",
    "zone.js": "0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "12.0.4",
    "@angular-eslint/builder": "12.1.0",
    "@angular-eslint/eslint-plugin": "12.1.0",
    "@angular-eslint/eslint-plugin-template": "12.1.0",
    "@angular-eslint/schematics": "12.1.0",
    "@angular-eslint/template-parser": "12.1.0",
    "@angular/cli": "12.0.4",
    "@angular/compiler-cli": "12.0.5",
    "@angular/language-service": "12.0.5",
    "@cypress/skip-test": "2.6.0",
    "@types/d3": "5.7.2",
    "@types/jasmine": "3.6.0",
    "@types/jasminewd2": "2.0.6",
    "@types/node": "12.12.31",
    "@typescript-eslint/eslint-plugin": "4.23.0",
    "@typescript-eslint/parser": "4.23.0",
    "body-parser": "1.19.0",
    "browser-sync": "2.27.1",
    "chai": "3.5.0",
    "chai-as-promised": "5.3.0",
    "chalk": "2.4.2",
    "cypress": "7.0.0",
    "cypress-multi-reporters": "1.5.0",
    "dateformat": "1.0.12",
    "debug": "4.1.1",
    "del": "1.2.1",
    "eslint": "7.26.0",
    "eslint-plugin-import": "2.23.4",
    "eslint-plugin-jsdoc": "35.4.0",
    "eslint-plugin-prefer-arrow": "1.2.3",
    "express": "4.17.1",
    "fs-extra": "10.0.0",
    "glob": "7.1.5",
    "install": "0.4.4",
    "intl": "1.2.5",
    "jasmine-core": "3.6.0",
    "jasmine-spec-reporter": "5.0.0",
    "jshint-stylish": "2.2.1",
    "junit-report-merger": "2.2.2",
    "karma": "6.3.4",
    "karma-chai": "0.1.0",
    "karma-chai-sinon": "0.1.5",
    "karma-chrome-launcher": "3.1.0",
    "karma-coverage": "2.0.3",
    "karma-coverage-istanbul-reporter": "3.0.2",
    "karma-growl-reporter": "0.1.1",
    "karma-intl-shim": "1.0.3",
    "karma-jasmine": "4.0.0",
    "karma-jasmine-html-reporter": "1.5.0",
    "karma-mocha": "0.2.2",
    "karma-parallel": "0.3.1",
    "karma-sinon": "1.0.5",
    "method-override": "2.3.10",
    "minimist": "1.2.5",
    "mocha": "2.5.3",
    "mocha-junit-reporter": "2.0.0",
    "morgan": "1.9.1",
    "node-fetch": "2.6.1",
    "node-notifier": "4.6.1",
    "node-sass": "4.14.1",
    "plato": "1.7.0",
    "protractor": "7.0.0",
    "q": "1.4.1",
    "run-sequence": "1.2.2",
    "rxjs-marbles": "6.0.1",
    "serve-favicon": "2.5.0",
    "sinon": "1.15.4",
    "sinon-chai": "2.14.0",
    "ts-node": "7.0.1",
    "typescript": "4.2.4",
    "wiredep": "2.2.2",
    "yargs": "13.1.0"
  }

Upvotes: 3