在 AngularJS 应用程序中找不到命名空间

如何解决在 AngularJS 应用程序中找不到命名空间

我正在尝试使用最新版本的 TypeScript 编译一个旧的 AngularJs 项目。我在编译我的应用程序时遇到问题，因为它使用了编译器似乎无法识别的外部模块。

我运行以下命令：

tsc app/scripts/app.ts
app/scripts/app.ts:34:19 - error TS2503: Cannot find namespace 'PaverFlash'.

34          private flash: PaverFlash.FlashService,~~~~~~~~~~

app/scripts/app.ts:35:18 - error TS2503: Cannot find namespace 'PaverAuth'.

35          private auth: PaverAuth.AuthService,~~~~~~~~~


Found 2 errors.

在 app/scripts/app.ts 脚本中使用了两个外部模块：

namespace Foo {
    export class Config { [...] }
    }

    export class Run {
        static $inject = ['$log','$window','flash','auth','profile'];

        constructor(
            private $log: angular.ILogService,private $window: angular.IWindowService,private flash: PaverFlash.FlashService,// <- here
            private auth: PaverAuth.AuthService,// <- and here
            private profile: any
        ) {
            $log.log('   foo.js app run');

            // --- use 10 sec pour all flash that don't override timeout
            flash.defaultTimeout = 10000;

            // --- Initialize routes that don't need authentication.
            auth.addStatesThatDontRequireAuth(['main.isalive','main.technical']);
        }
    }
}

angular.module('foo',['bar','baz'])
.config(Foo.Config)
.run(Foo.Run)

实际上，我使用 bower 作为包管理器，因此模块安装在 app/bower_components 目录中：

> ls -1 -d app/bower_components/paver-*
app/bower_components/paver-auth
app/bower_components/paver-flash

由于这是遗留代码，我不想更改模块实现。

如何告诉tsc接受或忽略这两个模块？

更多信息

> npm list
foo@16.2.7 /Users/me/workspace/foo
├── @types/angular-animate@1.5.10
├── @types/angular-gettext@2.1.34
├── @types/angular-material@1.1.72
├── @types/angular-sanitize@1.8.0
├── @types/angular-ui-router@1.1.40
├── @types/angular@1.8.0
├── @types/es6-shim@0.31.41
├── @types/jasmine@2.8.17
├── @types/jquery@2.0.56
├── @types/underscore.string@0.0.30
├── @types/underscore@1.10.24
├── @types/urijs@1.19.14
├── @typescript-eslint/eslint-plugin@4.15.0
├── @typescript-eslint/parser@4.15.0
├── grunt-asphalt@1.1.4
└── typescript@4.1.5

编辑

我找到了一个解决方法：我在我的项目中添加了以下文件：

app/scripts/services/auth/auth.service.d.ts
app/scripts/services/flash/flash.service.d.ts

并且我在类声明前添加了 export 关键字，例如：

/// <reference types="angular" />
/// <reference types="angular-material" />
declare namespace PaverAuth {
    // fix: add `export` keyword
    export class AuthService {
        private $log;
        private $mdDialog;
        static $inject: string[];
        defaultFlashTimeout: number;
        statesThatDontRequireAuth: string[];
        constructor($log: angular.ILogService,$mdDialog: angular.material.IDialogService);
        addStatesThatDontRequireAuth(states: any): void;
        isStateProtected(state: any): boolean;
        showChangePwdDialog(event: any): angular.IPromise<any>;
    }
}

但我不知道这样做是否正确。