Angular6 当组件在angular应用程序内部使用，并作为angular应用程序外部的自定义元素时，角度元素错误

我正在尝试变换我的角度分量，以便它在角度和非角度环境中运行

我已经将我的元素添加为导出，并将它们添加到自定义元素列表和条目组件列表中，以便将它们作为自定义元素导出

下面是我的

angular library

模块导出的代码

@NgModule({
  imports: [
    RouterModule,
    CommonModule,
    ReactiveFormsModule,
    NgbModule.forRoot(),
    CoreRoutingModule,
    FontAwesomeModule
  ],
  declarations: [
    HeaderComponent,
    FooterComponent,
    AlertsComponent,
    LoginComponent,
    ProfileComponent,
    PrivacyComponent,
    ChangeLocationModelComponent,
    CorouselComponent,
    FilterPipe,
    ContentLoadingComponent,
    AutoScrollDirective,
    ModelComponent
  ],
  exports: [
    HeaderComponent,
    FooterComponent,
    AlertsComponent,
    LoginComponent,
    ProfileComponent,
    PrivacyComponent,
    ChangeLocationModelComponent,
    CorouselComponent,
    ContentLoadingComponent,
    AutoScrollDirective,
    FontAwesomeModule
  ],
  entryComponents: [
    HeaderComponent,
    FooterComponent,
    AlertsComponent,
    LoginComponent,
    ProfileComponent,
    PrivacyComponent,
    ChangeLocationModelComponent,
    CorouselComponent,
    ContentLoadingComponent,
    ModelComponent
  ]
})
export class CoreModule {
  public static forRoot(): ModuleWithProviders {
    return {
      ngModule: CoreModule,
      providers: [
        AppService,
        AlertService,
        AppInitService,
        AuthGuardService,
        CoreService,
        EncryptionService,
        MapService,
        NoAuthGuardService,
        {
          provide: WINDOW,
          useFactory: windowFactory
        },
        UserService,
        GoogleAnalyticsService
      ]
    };
  }

  constructor(@Optional() @SkipSelf() parentModule: CoreModule, private injector: Injector) {
    if (parentModule) {
      throw new Error(
        'CoreModule is already loaded. Import it in the AppModule only');
    }
    customElements.define('cfs-header', createCustomElement(HeaderComponent, {injector}));
    customElements.define('cfs-footer', createCustomElement(FooterComponent, {injector}));
    customElements.define('cfs-alert', createCustomElement(AlertsComponent, {injector}));
    customElements.define('cfs-login', createCustomElement(LoginComponent, {injector}));
    customElements.define('cfs-profile', createCustomElement(ProfileComponent, {injector}));
    customElements.define('cfs-privacy', createCustomElement(PrivacyComponent, {injector}));
    customElements.define('cfs-change-location-model', createCustomElement(ChangeLocationModelComponent, {injector}));
    customElements.define('cfs-corousel', createCustomElement(CorouselComponent, {injector}));
    customElements.define('cfs-content-loading', createCustomElement(ContentLoadingComponent, {injector}));
    customElements.define('cfs-model', createCustomElement(ModelComponent, {injector}));

  }
}

然后在应用程序模块中作为forRoot（）导入

当我像下面这样从npm导入打包安装时，它会给我下面的错误

import {CoreModule} from '@candifood/core';
CoreModule.forRoot(),

// ERROR
DOMException: Failed to execute 'define' on 'CustomElementRegistry': this name has already been used with this registry
    at new CoreModule (http://localhost:4200/main.js:1045:24)
    at _createClass (http://localhost:4200/vendor.js:43333:20)
    at _createProviderInstance$1 (http://localhost:4200/vendor.js:43303:26)
    at initNgModule (http://localhost:4200/vendor.js:43239:32)
    at new NgModuleRef_ (http://localhost:4200/vendor.js:43962:9)
    at createNgModuleRef (http://localhost:4200/vendor.js:43951:12)
    at Object.debugCreateNgModuleRef [as createNgModuleRef] (http://localhost:4200/vendor.js:45776:12)
    at NgModuleFactory_.push../node_modules/@angular/core/fesm5/core.js.NgModuleFactory_.create (http://localhost:4200/vendor.js:46478:25)
    at http://localhost:4200/vendor.js:39376:43
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (http://localhost:4200/polyfills.js:2704:26)

当我直接将它们作为内部模块导入时，如下所示，它给出了以下错误

import { CoreModule } from '../../projects/somemodule/core/src/lib/core.module';
CoreModule.forRoot(),

// ERROR
Uncaught TypeError: Failed to construct 'HTMLElement': Please use the 'new' operator, this DOM object constructor cannot be called as a function.
    at NgElementImpl.NgElement [as constructor] (elements.js:391)
    at new NgElementImpl (elements.js:427)
    at EmulatedEncapsulationDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/platform-browser.js.DefaultDomRenderer2.createElement (platform-browser.js:1204)
    at EmulatedEncapsulationDomRenderer2.push../node_modules/@angular/platform-browser/fesm5/platform-browser.js.EmulatedEncapsulationDomRenderer2.createElement (platform-browser.js:1312)
    at DebugRenderer2.push../node_modules/@angular/core/fesm5/core.js.DebugRenderer2.createElement (core.js:11100)
    at createElement (core.js:7823)
    at createViewNodes (core.js:10062)
    at callViewAction (core.js:10417)
    at execComponentViewsAction (core.js:10336)
    at createViewNodes (core.js:10129)

仍在调试中，请提供帮助