Включить SSR для Angular 6 с .NET core 2 - PullRequest
Новая
       43

Включить SSR для Angular 6 с .NET core 2

0 голосов
/ 30 сентября 2018

Я создал веб-сайт, используя Angular 6 в качестве внешнего интерфейса и .Net Core 2.0 в качестве моего внешнего интерфейса.У меня не включен SSR и пока все работает нормально.Теперь я пытаюсь включить SSR, следуя документам Angular Universal (https://angular.io/guide/universal) и документам .Net Core (https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/angular?view=aspnetcore-2.1&tabs=visual-studio&utm_source=jeliknes&utm_medium=blog&utm_campaign=medium&WT.mc_id=medium-blog-jeliknes#server-side-rendering), но не удается! *

). Я полагаю, что проблема связана с основнымиФайл .server.ts - в соответствии с документами .NET Core мой main.server.ts должен выглядеть следующим образом: 

import 'zone.js/dist/zone-node';
import 'reflect-metadata';
import { renderModule, renderModuleFactory } from '@angular/platform-server';
import { APP_BASE_HREF } from '@angular/common';
import { enableProdMode } from '@angular/core';
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';
import { createServerRenderer } from 'aspnet-prerendering';
export { AppServerModule } from './app/app.server.module';

enableProdMode();

export default createServerRenderer(params => {
  const { AppServerModule, AppServerModuleNgFactory, LAZY_MODULE_MAP } = (module as any).exports;

  const options = {
    document: params.data.originalHtml,
    url: params.url,
    extraProviders: [
      provideModuleMap(LAZY_MODULE_MAP),
      { provide: APP_BASE_HREF, useValue: params.baseUrl },
      { provide: 'BASE_URL', useValue: params.origin + params.baseUrl }
    ]
  };

  const renderPromise = AppServerModuleNgFactory
    ? /* AoT */ renderModuleFactory(AppServerModuleNgFactory, options)
    : /* dev */ renderModule(AppServerModule, options);

  return renderPromise.then(html => ({ html }));
});

, а в соответствии с Angular main.server.ts должен выглядеть следующим образом: 

export { AppServerModule } from './app/app.server.module';

Я попробовал оба, и вот вывод: Когда я использую main.server.ts как предложено .NET Core, я получаю следующую ошибку: 

npmfail: AngularCliBuilder[0]
  ERROR in src/main.server.ts(13,75): error TS2304: Cannot find name 'module'.

после некоторых другихисключения (но я полагаю, что эта строка вызвала другие ошибки). Когда я пытаюсь использовать main.server.ts, как предложено Angular, я получаю следующую ошибку при загрузке браузеров: 

NodeInvocationException: Prerendering failed because of error: Error: The module at ./dist/server/main.js does not export a default function, and you have not specified which export to invoke.

Я был связан св течение нескольких дней безуспешно. Обратите внимание, что это рабочий веб-сайт с большим количеством импортированных сторонних библиотек, поэтому все простые «создать сайт - включить SSR - все работает» не подходят ...

Любые указатели? Спасибо!

** РЕДАКТИРОВАТЬ ** AДдинг мой main.ts, а также 

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

// import 'hammerjs'; // imported from index.html

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

1 Ответ

0 голосов
/ 17 ноября 2018

Если вы не решили эту проблему, попробуйте добавить types ": [" node "] к вашему tsconfig.app.json. 

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "types": [ "node" ]
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}
...