首页 文章

Angular-CLI错误：导出类的公共方法的返回类型具有或正在使用来自外部模块的名称'ErrorObservable'但无法命名

提问于
浏览 次
2

在构建了一个应用程序，该应用程序是一个正在运行的Angular 2（非cli）应用程序的克隆之后，我注意到我的几个文件正在产生错误（同一类型），因为项目是使用Angular-CLI构建的 . 我不清楚为什么这些是CLI版本中的错误，而不是另一个错误 . 这是与Webpack相关的问题吗？或者在两个版本之间如何处理Typescript的方式有关？为了澄清，初始应用程序使用SystemJS，而Angular-CLI版本使用Webpack . 当我说我“构建”了应用程序时，我的意思是我重新创建了我在此克隆版本的原始应用程序中拥有的所有组件，指令，模块，路由等 . 这是我得到的一般错误消息（跨多个文件）：

错误：从导出的类返回公共方法的类型具有或正在使用来自外部模块的名称'ErrorObservable'但无法命名

这是一个列为产生此错误的文件的示例：

import { Observable } from 'rxjs/Observable';
import { Http, Response } from '@angular/http';
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

@Injectable()
export class StreamCountsService {

    private _url: string = "https://api.somesite.com"

    constructor(private _http: Http) {}

    getCount() {
        return this._http.get(this._url)
            .map((response:Response) => response.json())
            .catch(this._errorsHandler);
    }
    _errorsHandler(error: Response) {
        console.error(error);
        return Observable.throw(error || "Server Error");
    }
}

我的设置：MacBook Air，OS X El Capitan

Angular-CLI版本运行Angular-CLI版本1.0.0-beta.22-1

完整的错误跟踪看起来像这样（为了隐私而略微编辑）：

vendor.bundle.js：52455 ./src/app/data/stream.service.ts模块构建失败：错误：/ Users / adds / Documents / abc / abc-cli / cli-abc / src / app / data / stream-assign.service.ts（20,5）：来自导出类的公共方法的返回类型具有或正在使用来自外部模块的名称'ErrorObservable'“/ Users / adds / Documents / abc / abc-cli / cli-abc / _checkDiagnostics上的node_modules / rxjs / observable / ErrorObservable“但无法命名 . ”（/ Users /adds / Documents / abc / abc-cli / cli-abc / node_modules / @ totools / webpack / src / loader.js：115：15 ）/Users/adds/Documents/abc/abc-cli/cli-abc/node_modules/@ngtools/webpack/src/loader.js:140:17 @ ./src/app/views/stream/stream-module . ts 25：0-82 @ ./src/app/app.module.ts @ ./src/app/index.ts @ ./src/main.ts @ multi main vendor.bundle.js：52455 ./src/ app / data / stream-assign.service.ts模块构建失败：错误：/Users/adds/Documents/abc/abc-cli/cli-abc/src/app/data/stream-assign-comm.service.ts( 20,5）：来自导出类的公共方法的返回类型具有或正在使用名称'ErrorObservab le'来自外部模块“/ Users / adds / Documents / abc / abc-cli / cli-abc / node_modules / rxjs / observable / ErrorObservable”但无法命名 . ）在_checkDiagnostics（/ Users / adds / Documents / abc / abc） -cli/cli-abc/node_modules/@ngtools/webpack/src/loader.js:115:15）at / users / adds / Documents / abc / abc-cli / cli-abc / node_modules / @ ngtools / webpack / src /loader.js:140:17 @ ./src/app/views/stream/stream-module.ts 25：0-82 @ ./src/app/app.module.ts @ ./src/app/index . ts @ ./src/main.ts @ multi main

这是我的package.json文件内容：

{
  "name": "cli-ark",
  "version": "0.0.1",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "start": "ng serve",
    "lint": "tslint \"src/**/*.ts\"",
    "test": "ng test",
    "pree2e": "webdriver-manager update",
    "e2e": "protractor"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "2.2.3",
    "@angular/compiler": "2.2.3",
    "@angular/core": "2.2.3",
    "@angular/forms": "2.2.3",
    "@angular/http": "2.2.3",
    "@angular/platform-browser": "2.2.3",
    "@angular/platform-browser-dynamic": "2.2.3",
    "@angular/router": "3.2.3",
    "@types/socket.io": "^1.4.27",
    "@types/socket.io-client": "^1.4.29",
    "angular-in-memory-web-api": "~0.1.15",
    "angular2-chartjs": "^0.1.6",
    "chart.js": "^2.4.0",
    "core-js": "^2.4.1",
    "ng2-charts": "^1.4.1",
    "rxjs": "5.0.0-beta.12",
    "socket.io": "^1.7.2",
    "socket.io-client": "^1.7.2",
    "ts-helpers": "^1.1.1",
    "zone.js": "^0.6.23"
  },
  "devDependencies": {
    "@angular/compiler-cli": "2.2.3",
    "@types/jasmine": "2.5.38",
    "@types/node": "^6.0.42",
    "angular-cli": "1.0.0-beta.22-1",
    "codelyzer": "~2.0.0-beta.1",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "1.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.0.2",
    "karma-remap-istanbul": "^0.2.1",
    "protractor": "4.0.9",
    "ts-node": "1.2.1",
    "typescript": "~2.0.3",
    "typings": "^1.3.2",
    "webdriver-manager": "10.2.5"
  }
}
javascript angular typescript rxjs angular-cli

2 回答

  • 1

    尝试使用：

    return Observable.throw(error.json().error || 'Server error');

    如果你使用rxjs> rc.5使用：

    import { ErrorObservable } from 'rxjs/observable/ErrorObservable';

    代替：

    import 'rxjs/add/observable/throw';

    这是不必要的

    import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
    回复于
  • 3

    在rx更新到5版之后，你应该使用

    ErrorObservable

    代替

    扔

    您的代码应更新自：

    import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/switchMap';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
...  
this.somethingReturnObservable.get()
  .filter( val => val*2)
  .do((val) => {
    // do something for example
  })
  .switchMap(trans => Observable.throw( 'some error' ))
  .catch( (er, c) => dosomething);

    至：

    import { ErrorObservable } from 'rxjs/observable/errorObservable';
import { switchMap, tap, catchError, filter } from 'rxjs/operators';
...
this.somethingReturnObservable.get()
  .pipe(
    filter( val => val*2)
    tap( (val) => {// do something for example} ),
    switchMap( trans => ErrorObservable.create( 'some error' ) ),
    catchError( (er, c) => dosomething);
  );
    回复于

相关问题