angular - Ionic 2 - Běhová chyba Nelze najít modul "."

Tuto chybu jsem zažil při spouštění mé aplikace Ionic 2 na localhostu pomocí příkazu:

ionic serve

Nejsem si jistý, odkud tato chyba pochází. Pečlivě jsem dvakrát zkontroloval všechny své importy kvůli poškozené cestě ve svých souborech TypeScript. Nic jsem nenašel.

Jediné změny provedené mezi fungováním aplikace a jejím nefungováním bylo přidání nového rozhraní pro uchovávání dat pro lokaci v Google Maps.

Nicméně nevidím, jak by to mohlo být relevantní, a musí to být něco jiného v procesu sestavování.

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
    }
} 

Verze Ionic

 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"
}

Může mi někdo poradit, jak to dále ladit? Měl bych ladit soubor polyfils.ts?

Odpověď č. 1

Vím, že níže uvedené řešení není váš případ, ale mám stejný problém v Ionic 3.

Řešení bylo nahlášeno v diskuzi o problému Webpack uživatelem @killian2301.

Stačí odstranit všechny importy, které mají na konci /umd.

V mém případě jsem změnil: import { IonicPageModule } from 'ionic-angular/umd'; Na: import { IonicPageModule } from 'ionic-angular';

Odpověď č. 2

To se často stává v Ionic 2+ kvůli neobvyklému automatickému importu IDE.

Změňte kód z

 import { TextInput } from 'ionic-angular/umd';

to

import { TextInput } from 'ionic-angular';

kdekoliv se vyskytuje s package/umd