2017-04-05 3 views
2

コマンドを使用して、私はlocalhostに自分イオン2アプリケーションを提供するとき、私はこのエラーを経験している:イオン2 - ランタイムエラーモジュール "。"が見つかりません。

ionic serve 

このエラーが由来ところ、私はわかりませんよ。私は細心の注意を払って、TypeScriptファイル内の壊れたパスのインポートをすべてチェックしました。私は何も発見していない。

Googleマップの場所のデータを保持するための新しいインターフェイスを追加するだけで、アプリケーションが機能しているかどうかの間に変更が加えられました。

しかし、これはどのように関連しているのかわかりませんし、ビルドプロセスで何か他のものでなければなりません。

app.modules.ts

import { NgModule, ErrorHandler } from '@angular/core'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { IonicStorageModule } from '@ionic/storage'; 
import { MyApp } from './app.component'; 
import { Geolocation } from '@ionic-native/geolocation'; 
import { Place } from '../model/place.model'; 
import { AboutPage } from '../pages/about/about'; 
import { ContactPage } from '../pages/contact/contact'; 

import { NewPlacePage } from '../pages/new-place/new-place'; 
import { PlacePage } from '../pages/place/place'; 
import { HomePage } from '../pages/home/home'; 
import { TabsPage } from '../pages/tabs/tabs'; 
import { ActivePage } from '../pages/active/active'; 
import { PlacesService } from '../services/places.service'; 
import { ConnectivityService } from '../providers/connectivity-service'; 
import {AgmCoreModule } from 'angular2-google-maps/core' 

@NgModule({ 
    declarations: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage, 
    ActivePage, 
    NewPlacePage, 
    PlacePage 
    ], 
    imports: [ 
    IonicModule.forRoot(MyApp), 
    IonicStorageModule.forRoot(), 
    AgmCoreModule.forRoot({ 
     apiKey: 'hiddenforstackoverflow' 
    }) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    AboutPage, 
    ContactPage, 
    HomePage, 
    TabsPage, 
    ActivePage, 
    NewPlacePage, 
    PlacePage 
    ], 
    providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}, ConnectivityService, PlacesService, Storage] 
}) 
export class AppModule {} 

places.service.ts

import { Injectable } from '@angular/core'; 
import { Storage } from '@ionic/storage'; 
import { Place } from '../model/place.model'; 


@Injectable() 
export class PlacesService { 

    private places: Place[] = []; 


    constructor(private storage: Storage) { } 
    addPlace(place: Place) { 
     this.places.push(place); 

     console.log(this.places); 
     this.storage.set('places', this.places); 

    } 

    getPlaces() { 
     return this.storage.get('places') 
      .then(
      (places) => { 
       this.places = places == null ? [] : places; 
       console.log(this.places); 
       console.log(places); 
       return this.places.slice(); 
      }); 

    } 
} 

newplace.ts

import { Component, Injectable } from '@angular/core'; 
import { NavController, NavParams } from 'ionic-angular'; 
import { PlacesService } from '../../services/places.service'; 
import { Geofence, Geolocation, SMS } from 'ionic-native'; 


@Component({ 
    selector: 'page-new-place', 
    templateUrl: 'new-place.html' 
}) 


export class NewPlacePage { 

    location: { lat: number, lng: number } = { lat: 0, lng: 0 }; 

    constructor(private placesService: PlacesService, private navCtrl: NavController) { } 

    onLocateUser() { 
    Geolocation.getCurrentPosition() 
     .then(
     (location) => { 
     console.log('Location successful') 
     this.location.lat = location.coords.latitude; 
     this.location.lng = location.coords.longitude 
     } 
    ) 
    } 
    onAddPlace(value: { title: string }) { 
    console.log(value); 
    this.placesService.addPlace({ title: value.title, location: this.location }); 
    this.navCtrl.pop(); 

    } 

} 

place.model.tsは

export interface Place { 
    title: string; 
    location: { 
     lat: number, 
     lng: number 
    } 
} 

イオンのバージョン

Ionic Framework: 2.2.0 
    Ionic Native: ^2.4.1 
    Ionic App Scripts: 1.2.5 
    Angular Core: 2.4.8 
    Angular Compiler CLI: 2.4.8 
    Node: 7.7.4 
    OS Platform: Windows 10 
    Navigator Platform: Win32 
    User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36 

package.json

{ 
    "name": "ionic-hello-world", 
    "author": "Ionic Framework", 
    "homepage": "http://ionicframework.com/", 
    "private": true, 
    "scripts": { 
    "clean": "ionic-app-scripts clean", 
    "build": "ionic-app-scripts build", 
    "ionic:build": "ionic-app-scripts build", 
    "ionic:serve": "ionic-app-scripts serve" 
    }, 
    "dependencies": { 
    "@angular/common": "2.4.8", 
    "@angular/compiler": "2.4.8", 
    "@angular/compiler-cli": "2.4.8", 
    "@angular/core": "2.4.8", 
    "@angular/forms": "2.4.8", 
    "@angular/http": "2.4.8", 
    "@angular/platform-browser": "2.4.8", 
    "@angular/platform-browser-dynamic": "2.4.8", 
    "@angular/platform-server": "2.4.8", 
    "@ionic-native/core": "^3.4.4", 
    "@ionic-native/geolocation": "^3.4.4", 
    "@ionic/storage": "2.0.0", 
    "@types/google-maps": "^3.2.0", 
    "angular2-google-maps": "^0.17.0", 
    "ionic-angular": "2.2.0", 
    "ionic-native": "^2.4.1", 
    "ionicons": "3.0.0", 
    "typescript": "2.0.9", 
    "rxjs": "5.0.1", 
    "sw-toolbox": "3.4.0", 
    "zone.js": "0.7.2" 
    }, 
    "devDependencies": { 
    "@ionic/app-scripts": "^1.2.5", 
    "sw-toolbox": "3.4.0", 
    "typescript": "2.0.9" 
    }, 
    "cordovaPlugins": [ 
    "cordova-plugin-whitelist", 
    "cordova-plugin-console", 
    "cordova-plugin-device", 
    "cordova-plugin-statusbar", 
    "cordova-plugin-splashscreen", 
    "ionic-plugin-keyboard" 
    ], 
    "cordovaPlatforms": [], 
    "description": "ionic-boiler: An Ionic project" 
} 

は、誰もがこれをさらにデバッグする方法についてのアドバイスを与えることができますか? polyfils.tsファイルをデバッグする必要がありますか?

答えて

2

あなたのアプローチには2つの問題があります。

問題1:あなたはこの古いモジュール"ionic-native": "^2.4.1", .Afterを削除する必要がnpm i

問題2を実行します。あなたはproviders配列内Geolocationを注入する必要がある(app.module.tsが)。あなたは、でこれを行う必要があります最新のイオン性ネイティブ("@ionic-native/core": "^3.4.4")。

詳しくは、Ionic Nativeをご覧ください。

関連する問題