Angular Сбой сборки App Shell из-за сторонних библиотек - PullRequest
Новая
       23

Angular Сбой сборки App Shell из-за сторонних библиотек

0 голосов
/ 06 февраля 2020

У меня проблемы с работой Angular App Shell. Поэтому я следовал инструкциям и настроил универсальный проект. Затем я также настроил App Shell и вижу, что конфигурация в нижней части моего angular. json хорошая. Но теперь, когда я запускаю 

ng run proj:app-shell

, я получаю ошибку, что окно не определено . Ошибка имеет смысл, потому что я использую сторонние библиотеки (в данном случае ckeditor), которые используют окно напрямую, но окно не может быть доступно из серверной среды Node.js.

Однако я не уверен, почему я получаю эту ошибку, потому что ckeditor используется внутри другого компонента, который НЕ должен быть частью app-shell.

Вот мой app.component. html 

<app-nav-menu></app-nav-menu>
<div class="page-body" [ngClass]="{'sidebar-expanded': (sidebarExpanded | async)}">
  <app-sidebar></app-sidebar>
  <div class="page-content-wrapper">
    <div class="content-viewport">
      <router-outlet></router-outlet>
    </div>
  </div>
</div>
<ngx-spinner type="ball-grid-beat" color="#696ffb" bdColor="rgba(200, 200, 200, 0.8)" size="medium"></ngx-spinner>

Ни один из компонентов app-nav-menu, app-sidebar и ngx-spinner не использует ckeditor! Ckeditor используется внутри text-element-component, который находится внутри ElementsModule, который я импортирую в app.module.ts 

import { ElementsModule } from './elements/elements.module';

Но почему это не получается для моей сборки app-shell, которая не должна использовать app. module.ts, но app.server.module.ts вместо этого, верно? Что-то мне здесь не хватает?

1 Ответ

0 голосов
/ 07 февраля 2020

Я потратил много времени на это. Проблема заключалась в том, что скрипт ckeditor ссылался на окно сразу при загрузке, так что оно вылетало в следующей строке: 

import * as ClassicEditor from '@ckeditor/ckeditor5-build-classic';

Вместо этого я использовал динамический c импорт внутри конструктора компонента: 

import('@ckeditor/ckeditor5-build-classic').then(e => { this.editor = e; });
...