Компонент является частью объявления двух модулей
Я пытаюсь собрать приложение 2 ionic. Когда я пробую приложение в браузере с ionic serve или запускаю его на эмуляторе, все работает нормально.
Но когда я пытаюсь построить его каждый раз, когда ошибка
ionic-app-script tast: "build"
Error Type AddEvent in "PATH"/add.event.ts is part of the declarations of 2 modules: AppModule in "PATH"/app.modules.ts and AddEvent in "PATH"/add-event.module.ts.
Please consider moving AddEvent in "PATH"/add-event.ts to a higher module that imports AppModule in "PATH"/app.module.ts and AddEventModule.
You can also creat a new NgModule that exports and includes AddEvent then import that NgModule in AppModule and AddEventModule
мой AppModule
import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { AngularFireModule } from 'angularfire2';
import { MyApp } from './app.component';
import { Eventdata } from '../providers/eventdata';
import { AuthProvider } from '../providers/auth-provider';
import { HttpModule } from '@angular/http';
import { HomePage } from '../pages/home/home';
import { Login } from '../pages/login/login';
import { Register } from '../pages/register/register';
import { AddEvent } from '../pages/add-event/add-event';
import { EventDetails } from '../pages/event-details/event-details';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
@NgModule({
declarations: [
MyApp,
HomePage,
Login,
Register,
AddEvent,
EventDetails
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
HttpModule,
AngularFireModule.initializeApp(config)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
Login,
Register,
AddEvent,
EventDetails
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}, Eventdata, AuthProvider
]
})
export class AppModule {}
и мой add-event.module.ts
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AddEvent } from './add-event';
@NgModule({
declarations: [
AddEvent,
],
imports: [
IonicPageModule.forChild(AddEvent),
],
exports: [
AddEvent
]
})
export class AddEventModule {}
Я понимаю, что должен удалить одно из объявлений, но не знаю как.
Если я удаляю объявление из AppModule, я получаю сообщение об ошибке, что страница входа не найдена во время выполнения ионной подачи
Ответы
Ответ 1
Удалите объявление из AppModule
, но обновите конфигурацию AppModule
, чтобы импортировать ваш AddEventModule
.
.....
import { AddEventModule } from './add-event.module'; // <-- don't forget to import the AddEventModule class
@NgModule({
declarations: [
MyApp,
HomePage,
Login,
Register,
//AddEvent, <--- remove this
EventDetails
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
HttpModule,
AngularFireModule.initializeApp(config),
AddEventModule, // <--- add this import here
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage,
Login,
Register,
AddEvent,
EventDetails
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}, Eventdata, AuthProvider
]
})
export class AppModule {}
Кроме того,
Обратите внимание, что важно, чтобы ваш AddEventModule
экспортировал компонент AddEvent
, если вы хотите использовать его вне этого модуля. К счастью, вы уже настроили это, но если бы он был опущен, вы бы получили ошибку, если бы попытались использовать компонент AddEvent
в другом компоненте вашего AppModule
Ответ 2
Некоторые люди, использующие Lazy loading
могут наткнуться на эту страницу.
Вот что я сделал, чтобы исправить разделение директивы.
- создать новый общий модуль
shared.module.ts
import { NgModule, Directive,OnInit, EventEmitter, Output, OnDestroy, Input,ElementRef,Renderer } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SortDirective } from './sort-directive';
@NgModule({
imports: [
],
declarations: [
SortDirective
],
exports: [
SortDirective
]
})
export class SharedModule { }
Затем в app.module и других ваших модулях
import {SharedModule} from '../directives/shared.module'
...
@NgModule({
imports: [
SharedModule
....
....
]
})
export class WhateverModule { }
Ответ 3
Решение очень простое. Найти *.module.ts
файлы и объявления комментариев. В вашем случае найдите addevent.module.ts
файл и удалите/прокомментируйте одну строку ниже:
@NgModule({
declarations: [
// AddEvent, <-- Comment or Remove This Line
],
imports: [
IonicPageModule.forChild(AddEvent),
],
})
Это решение работало в ионной 3 для страниц, генерируемых ionic-cli, и работает как в командах ionic serve
, так и ionic cordova build android --prod --release
!
Будьте счастливы...
Ответ 4
IN Angular 4. Эта ошибка рассматривается как проблема кега времени выполнения ng.
case: 1 эта ошибка произойдет, как только вы импортируете компонент в один модуль, и снова импортируется в подмодули.
case: 2 Импортируйте один компонент в неправильное место и удалите и замените в правильном модуле. В этот раз он рассматривает проблему с кешем обслуживания. Необходимо остановить проект и запустить -do снова ng, он будет работать, как ожидалось.
Ответ 5
Если ваши страницы создаются с использованием CLI, то он создает файл с именем filename.module.ts, тогда вам нужно зарегистрировать файл filename.module.ts в массиве import в файле app.module.ts и не вставлять эту страницу в массив объявлений,
например.
import { LoginPageModule } from '../login/login.module';
declarations: [
MyApp,
LoginPageModule,// remove this and add it below array i.e. imports
],
imports: [
BrowserModule,
HttpModule,
IonicModule.forRoot(MyApp, {
scrollPadding: false,
scrollAssist: true,
autoFocusAssist: false,
tabsHideOnSubPages:false
}),
LoginPageModule,
],
Ответ 6
Этот модуль добавляется автоматически, когда вы запускаете ионную команду. Однако это не нужно. Поэтому альтернативным решением является удаление add-event.module.ts из проекта.
Ответ 7
Вы можете просто попробовать это решение (для Ionic 3)
В моем случае эта ошибка возникает, когда я вызываю страницу, используя следующий код
this.navCtrl.push("Login"); // Bug
Я просто удалил кавычки, как показано ниже, а также импортировал эту страницу в верхней части файла, который я использовал, чтобы вызвать страницу входа
this.navCtrl.push(Войти);//Корректируем
Я не могу объяснить разницу в это время, так как я разработчик уровня начинающего
Ответ 8
Начиная с выпуска Ionic 3.6.0 каждая страница, созданная с использованием Ionic-CLI, теперь является модулем Angular. Это означает, что вы должны добавить модуль к вашему импорту в файле src/app/app.module.ts
import { BrowserModule } from "@angular/platform-browser";
import { ErrorHandler, NgModule } from "@angular/core";
import { IonicApp, IonicErrorHandler, IonicModule } from "ionic-angular";
import { SplashScreen } from "@ionic-native/splash-screen";
import { StatusBar } from "@ionic-native/status-bar";;
import { MyApp } from "./app.component";
import { HomePage } from "../pages/home/home"; // import the page
import {HomePageModule} from "../pages/home/home.module"; // import the module
@NgModule({
declarations: [
MyApp,
],
imports: [
BrowserModule,
IonicModule.forRoot(MyApp),
HomePageModule // declare the module
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage, // declare the page
],
providers: [
StatusBar,
SplashScreen,
{ provide: ErrorHandler, useClass: IonicErrorHandler },
]
})
export class AppModule {}
Ответ 9
Чтобы преодолеть эту ошибку, вы должны начать с удаления всех импортов app.module.ts и получить что-то вроде этого:
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { MyApp } from './app.component';
@NgModule({
declarations: [
MyApp
],
imports: [
BrowserModule,
HttpClientModule,
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}
Затем отредактируйте свой модуль страниц, например:
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HomePage } from './home';
@NgModule({
declarations: [
HomePage,
],
imports: [
IonicPageModule.forChild(HomePage),
],
entryComponents: [HomePage]
})
export class HomePageModule {}
Затем добавьте аннотацию IonicPage перед аннотацией компонента всех страниц:
import { IonicPage } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
Затем измените тип rootPage на строку и удалите импорт страниц (если он есть в компоненте приложения).
rootPage: string = 'HomePage';
Тогда функция навигации должна быть такой:
/**
* Allow navigation to the HomePage for creating a new entry
*
* @public
* @method viewHome
* @return {None}
*/
viewHome() : void
{
this.navCtrl.push('HomePage');
}
Вы можете найти источник этого решения здесь: Компонент является частью объявления 2 модулей
Ответ 10
$ionic generate создает модуль для страниц с ленивой загрузкой в ionic3
Если вы не хотите использовать ленивую загрузку, используйте
$ ionic generate [type] [name] --no-module
//Не генерировать NgModule для компонента
https://ionicframework.com/docs/cli/generate/
Ответ 11
Простое исправление,
Перейдите в файл app.module.ts
и remove/comment
все, что add_event
с add_event
. Нет необходимости добавлять компоненты в App.module.t
которые генерируются ionic cli
потому что он создает отдельный модуль для компонентов, который называется components.module.ts
.
Имеет необходимый импорт компонентов модуля
Ответ 12
Решено - Компонент является частью объявления 2 модулей
- Удалить файл pagename.module.ts в приложении
- Удалить import {IonicApp} из 'ionic-angular'; в файле pagename.ts
- Удалить @IonicPage() из файла pagename.ts
И запусти команду ionic cordova build android --prod - отпусти ее Работу в моем приложении
Ответ 13
Была такая же проблема. Просто заставьте удалить все вхождения модуля в "объявлениях", кроме AppModule.
Работал на меня.
Ответ 14
Как говорится в сообщении об ошибке, чтобы удалить модуль AddEvent из корневого каталога, если на вашей странице/компоненте уже есть файл ионного модуля, а не просто удалить его из другой/дочерней страницы/компонента, на конечной странице/компоненте должен присутствовать только один файл модуля. импортируется, если будет использоваться.
В частности, вы должны добавить в корневой модуль, если требуется на нескольких страницах, и если на определенных страницах, сохранить его только на одной странице.
Ответ 15
Я случайно создал свой собственный компонент с тем же именем, что и компонент библиотеки.
Когда я использовал свой IDE для автоматического импорта библиотеки для компонента, я выбрал не ту библиотеку.
Поэтому эта ошибка жаловалась, что я повторно объявлял компонент.
Я исправил это путем импорта из собственного кода компонента вместо библиотеки.
Я мог бы также исправить, назвав по-другому: избежать двусмысленности.
Ответ 16
Я вижу, что в документе, это может иметь вас больше, каждая версия вам нужна https://angular.io/guide/sharing-ngmodules
Ответ 17
В этом сценарии создайте другой общий модуль, в котором импортируйте все компоненты, которые используются в нескольких модулях.
В общем компоненте. объявить эти компоненты. А затем импортируйте общий модуль в appmodule, а также в другой модуль, к которому вы хотите получить доступ. Это будет работать на 100%, я сделал это и заставил это работать.
@NgModule({
declarations: [HeaderComponent, NavigatorComponent],
imports: [
CommonModule, BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
FormsModule,
]
})
export class SharedmoduleModule { }
const routes: Routes = [
{
path: 'Parent-child-relationship',
children: [
{ path: '', component: HeaderComponent },
{ path: '', component: ParrentChildComponent }
]
}];
@NgModule({
declarations: [ParrentChildComponent, HeaderComponent],
imports: [ RouterModule.forRoot(routes), CommonModule, SharedmoduleModule ],
exports: [RouterModule]
})
export class TutorialModule {
}
imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
FormsModule,
MatInputModule,
MatButtonModule,
MatSelectModule,
MatIconModule,
SharedmoduleModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Ответ 18
У меня была такая же ошибка, но я обнаружил, что при импорте AddEventModule
вы не можете импортировать модуль AddEvent
, так как в этом случае возникла бы ошибка.