“error TS2694: Namespace 'angular' has no exported member 'xxx'” after upgrading @types/angular

问题

After upgrading angular and @types/angular version to version 1.6.x I have lots of TS2694 errors:

error TS2694: Namespace 'angular' has no exported member 'material'
error TS2694: Namespace 'angular' has no exported member 'ui'
error TS2694: Namespace 'angular' has no exported member 'translate'

This worked fine before changing the version number.

What could cause the issue?

回答1:

The problem was related to several angular type definitions in my node_modules. Angular types were defined in node_modules/@types/angular and in node_modules/@types/ng-file-upload/node_modules/@types/angular.

This was due to the fact that yarn resolved angular with different versions. I had two entries for angular with different resolution in the yarn.lock file:

"@types/angular@*":
  version "1.6.7"
  resolved "https://registry.yarnpkg.com/@types/angular/-/angular-1.6.7.tgz#8935a2b4a796fe7ca4f59f533f467804722fb0c4"
  dependencies:
    "@types/jquery" "*"

"@types/angular@1.6.x":
  version "1.6.32"
  resolved "https://registry.yarnpkg.com/@types/angular/-/angular-1.6.32.tgz#fc791aad038227d9413eb5e552993e1076f8a509"

"@types/ng-file-upload@^11.1.31":
  version "11.1.34"
  resolved "https://registry.yarnpkg.com/@types/ng-file-upload/-/ng-file-upload-11.1.34.tgz#670fd0515c8e08668b27b7bbe30356b3b8011780"
  dependencies:
    "@types/angular" "*"

Removing the yarn.lock and rerunning yarn install solved the issue but it modified too many other dependency in my case.

Using yarn install --flat would probably have solved the problem but I didn't want to change how all dependencies are resolved.

So I fixed the issue by manually changing the yarn.lock file to

"@types/angular@*", "@types/angular@1.6.x":
  version "1.6.32"
  resolved "https://registry.yarnpkg.com/@types/angular/-/angular-1.6.32.tgz#fc791aad038227d9413eb5e552993e1076f8a509"

"@types/ng-file-upload@^11.1.31":
  version "11.1.34"
  resolved "https://registry.yarnpkg.com/@types/ng-file-upload/-/ng-file-upload-11.1.34.tgz#670fd0515c8e08668b27b7bbe30356b3b8011780"
  dependencies:
    "@types/angular" "*"

回答2:

Manually editing the file like in the accepted answer above caused some issues for me.

Running "yarn upgrade" or altering some packages would revert the manually edited change and my app would be broken again.

To fix this I added a resolution to package.json which fixes the issue of resolving different versions.

"resolutions": {
  "**/@types/angular": "1.6.20"
 },

来源：https://stackoverflow.com/questions/46666667/error-ts2694-namespace-angular-has-no-exported-member-xxx-after-upgrading