google maps apiはDirectionsService（）のdirections.js依存関係を提供していません

Question

Googleマップのapi v3を反応させようとしていますが、Googleマップサービスの一部が反応を使用して読み込まれていないようです。私はthis tutorial経由でスクリプトをロードし、index.htmlファイルにスクリプトを直接ロードするだけで、役に立たないのは面倒です。私は、次の依存関係を作成反応するアプリを使用しています：

"classnames": "^2.2.5", 
"invariant": "^2.2.2", 
"node-sass-chokidar": "0.0.3", 
"npm-run-all": "^4.1.1", 
"prop-types": "^15.5.10", 
"react": "^15.6.1", 
"react-dom": "^15.6.1", 
"react-redux": "^5.0.6", 
"react-scripts": "1.0.13", 
"redux": "^3.7.2" 

私は外のDirectionsServiceコードのインスタンス化を取れば私のアプリケーションを反応させ、それが、その後codepenに反応してGMAPのAPIに私は同じように含めますすべてのGoogleマップの依存関係が読み込まれているようです。実際、コードペンからDirectionsServiceコードへの参照を削除するまで、directions.jsファイルはまだネットワークタブに読み込まれています。

しかし、これは私のネットワークタブのように見えるものである反応で：

することは誰もが今までこのような何かを経験していますか？

Answer 1

地図の前にDirectionsService()をインスタンス化する必要があることが判明しました。

loadMap(node) { 
    if (this.props && this.props.google) { 
     const { google } = this.props; 

     // instantiate Direction Service first 
     this.directionsService = new google.maps.DirectionsService(); 

     this.directionsDisplay = new google.maps.DirectionsRenderer({ 
     suppressMarkers: true, 
     }); 

     const zoom = 13; 
     const mapTypeId = google.maps.MapTypeId.ROADMAP; 
     const lat = 37.776443; 
     const lng = -122.451978; 
     const center = new google.maps.LatLng(lat, lng); 

     const mapConfig = Object.assign({}, { 
     center, 
     zoom, 
     mapTypeId, 
     }); 


     this.map = new google.maps.Map(node, mapConfig); 

     this.directionsDisplay.setMap(this.map); 

     // make the map instance available to other components as it is just data 
     this.props.dispatchGoogleMap(this.map); 
    } 
    }