Ionique 2 - Runtime erreur Impossible de trouver le module “.”
J'ai vécu cette erreur au moment de servir, mon Ionique 2 application sur mon localhost par l'aide de la commande:
ionic serve
Je ne suis pas sûr où cette erreur provient de. J'ai méticuleusement vérifié tous mes importations pour un bris de chemin dans mon fichier d'enregistrement des fichiers. Je n'ai rien trouvé.
Les seules modifications apportées entre la demande de travail et pas de travail a été l'ajout d'une nouvelle interface pour conserver les données pour une carte Google maps Emplacement.
Cependant, je ne vois pas comment ce serait pertinent, et il doit être quelque chose d'autre dans le processus de construction.
app.les 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 {}
lieux.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.de modèle.ts
export interface Place {
title: string;
location: {
lat: number,
lng: number
}
}
Ionique Versions
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
paquet.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"
}
Quelqu'un peut-il donner des conseils sur la façon de corriger de cette nouvelle? Dois-je déboguer le polyfils.ts fichier?
Vous devez vous connecter pour publier un commentaire.
Je vois 2 problèmes sur votre approche.
Question 1: Vous devez supprimer cet ancien module
"ionic-native": "^2.4.1",
.Après cette sérienpm i
Question 2: Vous avez besoin d'injecter
Geolocation
à l'intérieur de laproviders
array (app.module.ts
).Vous devez le faire avec la dernière ionique natif ("@ionic-native/core": "^3.4.4"
).Vous pouvez en lire plus à ce sujet ici: Ionique Natif.
Je sais que la solution ce n'est pas votre cas, mais j'ai le même problème dans Ionique 3.
La solution a été signalé sur Webpack question discution
par @killian2301.
Suffit d'enlever toutes les importations qui ont /umd à la finale.
Dans mon cas, j'ai changé:
import { IonicPageModule } from 'ionic-angular/umd';
Pour:
import { IonicPageModule } from 'ionic-angular';
Cela se produit fréquemment dans Ionique 2+ , en raison de inhabituel pour l'importation automatique de l'IDE.
Modifier le code de
à
à l'endroit où cela se produit avec package/umd