2016-10-06 9 views
0

は私がHTTP GETリクエストにするためにサービスを使用していた場合にのみ:使用している場合Angular2:this.http.get(...)マップが関数ではなく、AOTコンパイル

import { Headers, Http }  from '@angular/http'; 
import { Observable }   from 'rxjs'; 
import 'rxjs/add/operator/map'; 

.... classcode..... 

getOffices(): Observable<Office[]> { 
    const url = `${this.apiurl}office` 
    console.log(url); 
    return this.http.get(url) 
     .map(response => response.json()); 
    }; 

このすべての作品を私が開発している間に私が使用しているSystemJS。私はロールアップしてAOTコンパイルを使用してuglifyとき はしかし、私はエラーを取得しておいてください。

bundle.min.js:7 EXCEPTION: Uncaught (in promise): TypeError: this.http.get(...).map is not a function

私は見つけることができるすべては、人々がmain.tsファイルまたはapp.module.tsファイルにimport 'rxjs/add/operator/map'を追加するために言っています。私はすべての関連ファイルに加えて、関連するすべてのファイルにimport 'rxjs/Rx'を追加しましたが、何も動作していないようです..

AoTコンパイルと組み合わせてhttpリクエストを使用した人はいますか?

これは私がIBMアカデミーのために使用しているデTSconfigのファイルです:

{ 
    "compilerOptions": { 
    "target": "es2015", 
    "module": "es2015", 
    "moduleResolution": "node", 
    "declaration": false, 
    "removeComments": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "sourceMap": true, 
    "pretty": true, 
    "allowUnreachableCode": false, 
    "allowUnusedLabels": false, 
    "noImplicitAny": true, 
    "noImplicitReturns": true, 
    "noImplicitUseStrict": false, 
    "noFallthroughCasesInSwitch": true, 
    "outDir": "./dist", 
    "rootDir": "./compiled" 
    }, 
    "compileOnSave": false, 
    "files": [ 
    "compiled/main-ngc.ts" 
    ], 
    "filesGlob":[ 
     "typings.d.ts", 
     "compiled/main-ngc.ts", 
     "compiled/main.ts" 
     ], 
    "exclude": [ 
    "node_modules" 
    ] 
} 

、これらは私が使用しているビルドコマンドです:

"build": "tsc -p tsconfig-compiled.json && gulp libs", 
"rollup": "rollup -f iife -c -o dist/bundle.es2015.js", 
"es5": "tsc --target es5 --allowJs dist/bundle.es2015.js --out dist/bundle.js", 
"build_prod": "npm run ngc && npm run build && npm run rollup && npm run es5 && npm run minify && gulp clean:build && gulp build_prod", 
"minify": "uglifyjs dist/bundle.js --screw-ie8 --compress --mangle --output dist/bundle.min.js", 

を任意のヘルプは歓迎されるでしょう!

答えて

0

解決策が見つかりました。 問題は、ロールアップを使用しているツリーシェイク中でした。 私はrollup.config.jsファイルでrefxとしてrxjsライブラリを追加しませんでした。

import rollup  from 'rollup'; 
import nodeResolve from 'rollup-plugin-node-resolve'; 
import commonjs from 'rollup-plugin-commonjs'; 
import uglify from 'rollup-plugin-uglify'; 

export default { 
    entry: 'dist/main.js', 
    dest: 'dist/bundle.min.js', 
    sourceMap: true, 
    format: 'iife', 
    moduleName: 'main', 
    plugins: [ 
     nodeResolve({jsnext: true, module: true}), 
     commonjs({ 
     include: 'node_modules/rxjs/**', 
     }), 
     uglify() 
    ] 
} 

ここで手がかりはcommonjs一部です:

commonjs({ 
    include: 'node_modules/rxjs/**', 
    }) 

・ホープこれは誰かに役立ちます!

関連する問題