Question

更新

我修复了启动时崩溃应用程序的模糊错误。这与TypeScript不编译无关。 In the main.ts file in the Git repo我只需更改一行：

platformBrowserDynamic().platform.bootstrapModule(AppModule);

要：

platformBrowserDynamic().bootstrapModule(AppModule);

现在，当应用程序启动时，它可以正常运行。

但是，TypeScript仍然无法编译 - 我收到以下错误：

node_modules/firebase/firebase.d.ts(391,3): error TS2300: Duplicate identifier 'export='.
typings/globals/firebase/index.d.ts(323,2): error TS2300: Duplicate identifier 'export='.

我的tsconfig.json文件如下：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "typeRoots": [ "../node_modules/@types" ],
    "listFiles": true
  },
  "files": [ "typings/index.d.ts" ],
  "include": [ "app/**/*" ]
}

我有一个Angular应用程序，它使用Firebase（AngularFire2）作为auth和数据库。

我刚刚使用AngularFire2库时一切正常，但我需要使用Firebase的ServerValue.TIMESTAMP，根据我的阅读要求导入Firebase以及AngularFire2。

来自网络上的各种来源，包括答案，我们相信我现在正在将Firebase正确导入我的应用程序。

这需要将"files": [ "typings/index.d.ts" ]添加到我的tsconfig.json文件，例如

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "typeRoots": [ "../node_modules/@types" ],
    "listFiles": true
  },
  "include": [ "../app/**/*.ts" ],
  "exclude": [ "../node_modules" ],
  "files": [ "typings/index.d.ts" ]
}

在我的systems.config.js文件as per this question中引用Firebase。

这解决了TypeScript编译器抱怨的很多重复错误，但是......

该应用程序现在在启动时崩溃，只是模糊的错误：

[Error] Error: 

    eval code
    eval@[native code]
    run@http://localhost:3000/node_modules/zone.js/dist/zone.js:96:49
    http://localhost:3000/node_modules/zone.js/dist/zone.js:462:60
    invokeTask@http://localhost:3000/node_modules/zone.js/dist/zone.js:236:42
    runTask@http://localhost:3000/node_modules/zone.js/dist/zone.js:136:57
    drainMicroTaskQueue@http://localhost:3000/node_modules/zone.js/dist/zone.js:368:42
    invoke@http://localhost:3000/node_modules/zone.js/dist/zone.js:308:44
    Evaluating http://localhost:3000/app/main.js
    Error loading http://localhost:3000/app/main.js — system.src.js:123:88
    (anonymous function) (localhost:16)
    run (zone.js:96)
    (anonymous function) (zone.js:462)
    invokeTask (zone.js:236)
    runTask (zone.js:136)
    drainMicroTaskQueue (zone.js:368)
    invoke (zone.js:308)

我还认为app目录中的我的TypeScript文件没有编译。当我记录哪些文件编译时，我在终端中得到以下内容：

[0] /Users/jonathonoates/Sites/my-app/node_modules/typescript/lib/lib.d.ts
[0] /Users/jonathonoates/Sites/my-app/typings/globals/core-js/index.d.ts
[0] /Users/jonathonoates/Sites/my-app/typings/globals/firebase/index.d.ts
[0] /Users/jonathonoates/Sites/my-app/typings/globals/jasmine/index.d.ts
[0] /Users/jonathonoates/Sites/my-app/typings/globals/node/index.d.ts
[0] /Users/jonathonoates/Sites/my-app/typings/index.d.ts

我已经设置了Git repo for you to examine here的分支。

希望有人熟悉这个问题，可以提供帮助！

Answer 1

因此，根据更新，模糊错误已经解决。

我仍然遇到error TS2300: Duplicate identifier问题。

我卸载了Firebase全局类型，因此我的typings.json文件如下所示：

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160725163759",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160909174046"
  }
}

我调整了我的systemjs.config.js以引用AngularFire2中的Firebase，如：

(function (global) {
  System.config({
    map: {
      app: 'app',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',
      angularfire2: 'npm:angularfire2',
      firebase: 'npm:angularfire2/node_modules/firebase',
      rxjs: 'npm:rxjs'
    },
    packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js'
      },
      'angular2-in-memory-web-api': {
        main: './index.js',
        defaultExtension: 'js'
      },
      angularfire2: {
        main: './bundles/angularFire2.umd.js',
        defaultExtension: 'js'
      },
      firebase: {
        main: './firebase.js',
        defaultExtension: 'js'
      },
      rxjs: {
        defaultExtension: 'js'
      }
    },
    paths: { 'npm:': './node_modules/' }
  });
})(this);

请注意map。

中的Firebase参考

然后我将import * as firebase from 'firebase';添加到我想要使用它的组件[根据此记录的问题]并且重要的是将其添加到angularfire2.d.ts文件的顶部。 1

完整的fixed code can be found in this Git branch。

Angular2和Firebase应用程序中的TypeScript未编译

更新

1 个答案: