Question

我已将我的应用程序更新为RC6，现在我不断收到此错误：

zone.js：484未处理的承诺拒绝：BrowserModule已经存在已装载。如果您需要访问常用指令，如NgIf和来自懒惰加载模块的NgFor ...

我正在使用延迟加载，我的应用程序被分解为许多延迟加载的模块。然而在RC5中一切正常。

我在RC6的更改日志中找到的唯一变化是：

编译器：为无效的NgModule抛出描述性错误消息提供商

但由于我没有在RC5中看到任何错误，这可能不适用于此。

我有点想法，所以非常感谢任何帮助。

Answer 1

我认为您正在使用NoopAnimationsModule＆＃39;或者＆＃39; BrowserAnimationsModule＆＃39;，其中已包含＆＃39; BrowserModule＆＃39;并懒洋洋地加载你的模块。所以解决方案是用“NoopAnimationsModule”或“浏览器动画模块”替换BrowserModule＆＃39;在你的app.module.ts＆＃39;。

import { Router } from '@angular/router';
import { AdminsModule } from './admins/admins.module';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
//import { BrowserModule } from '@angular/platform-browser';
import { NgModule,OnInit } from '@angular/core';
import { AppComponent } from './app.component'; 
@NgModule({
    declarations: [
        AppComponent,
    ],
    imports: [
    //BrowserModule,
    NoopAnimationsModule,
    FormsModule
],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule {}

Answer 2

我设法解决了我的问题。我正在使用的其中一个库是导入BrowserModule。

我会在这里留下问题，以防有人遇到同样的问题。

Answer 3

在我的情况下，我在使用材料设计的每个组件中使用了BrowserAnimationsModule，我删除了对“BrowserAnimationsModule”的所有引用，并将BrowserAnimationsModule放在主模块中。

BrowserAnimationsModule已经包含了BrowserModule，这就是问题所在。

Answer 4

由于错误描述是不言自明的，因此您要为其实现延迟加载的模块不应导入BrowserModule，因为之前已经导入了该模块（主要在app.component中）。您应该只导入一次BrowserModule。其他模块应该是导入CommonModules。

请参阅以下代码以了解

scores = cross_val_score(RFC, xtrain, ytrain, cv = 10, scoring='precision')

注意：这不是我自己的答案。我遇到了同样的问题。我自己有一个与角度相同的CommonModule。所以这对我来说真的很麻烦，因为我没有意识到角度本身存在另一个“CommonModule”。我发现这个blog很有帮助。从那里发布答案。

Answer 5

我遇到了类似的问题。我有全部使用BrowserAnimationModule（包括BrowserModule）的服务器延迟加载模块。

我的解决方案首先是将该模块的导入从子模块移至根模块，即app.module.ts。

//app.module.ts
@NgModule({
    declarations: [  ],
    imports: [    BrowserAnimationsModule,]

第二步非常重要，您还应该在每个子模块中包括CommonModule。

//lazychild.module.ts
@NgModule({
  declarations: [  ],
  imports: [  CommonModule,]

Answer 6

我通过在app.component.ts中使用它来解决了这个问题：

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
  imports: [
..,
    BrowserAnimationsModule,
  ],

并将其从其他任何地方删除。

Answer 7

如此处Angular Issues Page所述，您可以制作一个Shared Module并在其中添加所有导入一次，然后在创建新模块的任何地方导入该模块。

Answer 8

除了从AppModule中删除“ BrowserAnimationsModule”的所有导入。

Answer 9

没有一个答案对我有用。

对于仍在寻找答案的人们，如果您使用的是 SharedModule （以及延迟加载），我的答案可能会对您有所帮助。

解决方案：将以下导出：BrowserModule，BrowserAnimationsModule，HttpModule和HttpClientModule（来自SharedModule）迁移到 AppModule中。

示例：

OLD shared.module.ts ：

@NgModule({
   declarations: [],
   imports: [],
   exports: [
      BrowserModule,
      BrowserAnimationsModule,
      HttpClientModule,
      // ...
   ]
})
export class SharedModule { }

OLD app.module.ts ：

@NgModule({
   declarations: [
      AppComponent,
   ],
   imports: [
      SharedModule
   ],
   providers: [],
   exports: [],
   bootstrap: [AppComponent]
})
export class AppModule { }

新的shared.module.ts ：

@NgModule({
   declarations: [],
   imports: [],
   exports: [
      // ...
   ]
})
export class SharedModule { }

新的app.module.ts ：

@NgModule({
   declarations: [
      AppComponent,
   ],
   imports: [
      BrowserModule,
      BrowserAnimationsModule,
      HttpClientModule,
      SharedModule
   ],
   providers: [],
   exports: [],
   bootstrap: [AppComponent]
})
export class AppModule { }

Answer 10

已解决的BrowserModule已加载问题

在我的项目中，我直接在另一个子模块中导入一个自己的模块，而在共享模块中未提及，这会导致错误。

BrowserModule已经加载错误

10 个答案: