Angular2 bundle.js：2 Uncaught ReferenceError：Googleが定義されていません

Question

2.0.0-rc.4バージョンの角度を使用します。私はいつも私のコンソールで問題

console error

bundle.js:2 Uncaught ReferenceError: google is not defined 
With Angular Beta without gulp, I have not had the problem. 

typings folder content

私の** gulpfile.jsを "グーグルが定義されていない" している**

var gulp = require('gulp'); 

    gulp.task('bundle', function() { 
     var SystemBuilder = require('systemjs-builder'); 
     var builder = new SystemBuilder(); 

     builder.loadConfig('./system.config.js') 
      .then(function(){ 
       var outputFile = 'dist/bundle.js'; 
       return builder.buildStatic('app', outputFile, { 
        minify: true, 
        mangle: true, 
        rollup: true 
       }); 
      }) 
      .then(function(){ 
       console.log('bundle built successfully!'); 
      }); 
    }); 

パッケージを提出.json

{ 
    "name": "angular2-poc", 
    "scripts": { 
    "clean": "gulp clean", 
    "compile": "gulp compile", 
    "build": "gulp build", 
    "postinstall": "typings install", 
    "test": "tsc && karma start", 
    "tsc": "tsc", 
    "tsc:w": "tsc -w", 
    "lite": "lite-server", 
    "start": "concurrent \"npm run tsc:w\" \"npm run lite\" ", 
    "typings": "typings" 
    }, 
    "devDependencies": { 
    "concurrently": "^1.0.0", 
    "gulp": "^3.9.1", 
    "gulp-concat": "^2.6.0", 
    "gulp-jshint": "^2.0.1", 
    "gulp-minify": "0.0.11", 
    "gulp-rename": "^1.2.2", 
    "gulp-sass": "^2.3.1", 
    "gulp-uglify": "^1.5.3", 
    "gulp-util": "^3.0.7", 
    "jasmine-core": "~2.3.4", 
    "jshint": "^2.9.2", 
    "karma": "~0.13.15", 
    "karma-jasmine": "~0.3.6", 
    "karma-phantomjs2-launcher": "^0.3.2", 
    "lite-server": "2.0.1", 
    "path": "^0.12.7", 
    "systemjs-builder": "^0.15.16", 
    "traceur": "^0.0.91", 
    "typescript": "^1.7.3", 
    "yargs": "^4.7.0" 
    }, 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.4", 
    "@angular/compiler": "2.0.0-rc.4", 
    "@angular/core": "2.0.0-rc.4", 
    "@angular/http": "2.0.0-rc.4", 
    "@angular/platform-browser": "2.0.0-rc.4", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.4", 
    "@angular/router": "3.0.0-beta.1", 
    "@angular/upgrade": "2.0.0-rc.4", 
    "@angular/forms": "0.2.0", 
    "es6-shim": "^0.35.0", 
    "events": "^1.0.2", 
    "fbjs": "^0.3.1", 
    "flux": "^2.1.1", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "systemjs": "0.19.27", 
    "zone.js": "^0.6.12" 

}}

マイtsd.jsonファイル

{ 
     "version": "v4", 
     "repo": "borisyankov/DefinitelyTyped", 
     "ref": "master", 
     "path": "typings", 
     "bundle": "typings/tsd.d.ts", 
     "installed": { 
     "googlemaps/google.maps.d.ts": { 
      "commit": "de82425735f84a10b43921ae4b1d085b3752a626" 
     } 
     } 
    } 

おかげで、あなたに

Answer 1

あなたのindex.htmlからこれらの2つのファイルをロードしてみ

<script src="https://www.gstatic.com/charts/loader.js"></script> 
<script type="text/javascript" src="https://www.google.com/jsapi"></script> 

詳細については、こちらを参照してください。https://developers.google.com/chart/interactive/docs/basic_load_libs

これが役立つかどうかをご覧ください。