Angular 2: @agm \ core \ index.js: 2 - Unexpected token export

Question

Hi, I'm pretty new to angular 2, as all the syntax needs your help to deal with the error below. I am trying to implement a Google autocomplete dashboard. Therefore, the @ agm / core package is used for this.

Now when I started the project, I encountered an error, as shown below:

An unhandled exception occurred while processing the request.

Exception: Call to Node module failed with error: Prerendering failed because of error: F:\Hcue\Zaumm\zaaum\zaaum\zaaum\node_modules\@agm\core\index.js:2
    export * from './directives';
    ^^^^^^
    SyntaxError: Unexpected token export
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at Object.module.exports (F:\Hcue\Zaumm\zaaum\zaaum\zaaum\ClientApp\dist\main-server.js:1321:19)
    at __webpack_require__ (F:\Hcue\Zaumm\zaaum\zaaum\zaaum\ClientApp\dist\main-server.js:20:30)
    Current directory is: F:\Hcue\Zaumm\zaaum\zaaum\zaaum

Using "@ agm / core": "1.0.0-beta.0" in my package. json

Please let me know what I am doing wrong. Amazed by this and can not move on. Thanks in advance.

I solved the problem with the cards and got auto-complete in my web project. Paste the file "angular2-google-maps": "^0.16.0"into the package.json file or run it npm install angular2-google-maps@0.16.0.

Add import { AgmCoreModule, MapsAPILoader} from 'angular2-google-maps/core';to the app.module.ts file.

TS, .

import { Component, NgModule, OnInit, NgZone  } from '@angular/core';
import { AgmCoreModule, MapsAPILoader } from 'angular2-google-maps/core';


declare var google: any;

@Component({
    selector: 'settings',
    template: require('./account.component.html'),
    providers: [UserService]
})


export class AccountComponent implements OnInit {



markers: marker[] = [];

constructor(
        private _loader: MapsAPILoader,
        private _zone: NgZone) {
    }

    ngOnInit() {
            this.autocomplete();      
    }

    autocomplete() {
        this._loader.load().then(() => {
            var autocomplete = new google.maps.places.Autocomplete(document.getElementById("autocompleteInput"), {});
            google.maps.event.addListener(autocomplete, 'place_changed', () => {
                this._zone.run(() => {
                    debugger;
                    var place = autocomplete.getPlace();
                    this.addressField = place.formatted_address;
                    this.markers = [];
                    this.markers.push({
                        lat: place.geometry.location.lat(),
                        lng: place.geometry.location.lng(),
                        label: place.name,
                        draggable: false,
                        animation: ''
                    });
                    this.lat = place.geometry.location.lat();
                    this.lng = place.geometry.location.lng();
                    console.log(place);
                });
            });
        });
    }

    // google maps zoom level
    zoom: number = 11;

    // initial center position for the map
    lat: number = 13.0405026;
    lng: number = 80.2336924;

    clickedMarker(label: string, index: number) {
        debugger;
        console.log(`clicked the marker: ${label || index}`)
    }

    mapClicked($event: any) {
        debugger;
        this.markers.push({
            'lat': $event.coords.lat,
            'lng': $event.coords.lng,
            'label': '',
            'draggable': false,
            'animation': google.maps.Animation.DROP
        });
        debugger;
    }

    markerDragEnd(m: marker, $event: MouseEvent) {
        debugger;
        console.log('dragEnd', m, $event);
    }


}


interface marker {
    lat: number;
    lng: number;
    label?: string;
    draggable: boolean;
    animation: any;
}

HTML , .

<input type="text" [(ngModel)]="model.address" id="autocompleteInput" class="validate">

HTML-, .

<sebm-google-map [latitude]="lat"
                             [longitude]="lng"
                             [zoom]="zoom"
                             [disableDefaultUI]="false"
                             [zoomControl]="true" style="height: 300px; width: 600px;">

                <sebm-google-map-marker *ngFor="let m of markers; let i = index"
                                        (markerClick)="clickedMarker(m.label, i)"
                                        [latitude]="m.lat"
                                        [longitude]="m.lng"
                                        [label]="m.label"
                                        [markerDraggable]="m.draggable"
                                        (dragEnd)="markerDragEnd(m, $event)">
                </sebm-google-map-marker>

            </sebm-google-map>

.