Как определить DTO классы API и использовать их в Angular 7 SSR - PullRequest
0 голосов
/ 09 мая 2019

Я настраиваю угловое приложение в качестве SPA .net core web api.Таким образом, у меня есть классы DTO, которые мои остальные API возвращают в мое угловое приложение.Из-за отсутствия SEO для Google Angular2 + JS Framework мне пришлось работать с Angular Universal.Мои зависимости package.json:

"dependencies": {
    "@angular/animations": "^7.0.4",
    "@angular/cdk": "^7.3.7",
    "@angular/common": "~7.0.0",
    "@angular/compiler": "~7.0.0",
    "@angular/core": "~7.0.0",
    "@angular/forms": "~7.0.0",
    "@angular/http": "~7.0.0",
    "@angular/platform-browser": "~7.0.0",
    "@angular/platform-browser-dynamic": "~7.0.0",
    "@angular/platform-server": "~7.0.0",
    "@angular/router": "~7.0.0",
    "@ng-toolkit/universal": "^1.1.47",
    "@nguniversal/express-engine": "~7.0.0",
    "@nguniversal/module-map-ngfactory-loader": "~7.0.0",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "core-js": "^2.5.4",
    "cors": "~2.8.4",
    "rxjs": "~6.3.3",
    "ts-loader": "4.2.0",
    "webpack-cli": "^2.1.4",
    "zone.js": "~0.8.26"
}

Поскольку отладка углового приложения из-за отсутствия полезных сообщений об ошибках раздражает, с SSR оно становится еще более раздражающим.

Вот проблема,

У меня есть сервисы, которые делают http-запросы и возвращают массив объектов или отдельный объект или ноль, классический подход API остальных.Так как мы используем TypeScript, сначала я объявил классы для своих объектов ответа, которые не работают во время компиляции SSR, поэтому я изменил эти определения с интерфейсами, но это тоже не сработало.Вот некоторые примеры моих интерфейсов:

export interface Media{
    link?:string;
    alt?:string;    
}

export interface Category {    
    id:number;
    media?:Media;
    cultures?:CategoryCulture[];
}

export interface CategoryCulture{
    cultureId:number;
    name:string;
    generalDescription?:string;
}

Когда я импортирую их в свои классы компонентов или служб, я могу использовать их в качестве идентификаторов типов.Стандартный

ng serve 

работает нормально и никаких проблем не возникает.Но когда я использую

npm run build:prod;npm run server

Появляется ошибка.

src/app/main/home/categories/categories.component.ts(3,26): error TS2307: Cannot find module 'src/app/models/category'.

далее появляется сообщение:

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! LiderFinal@0.0.0 build:server:prod: `ng run LiderFinal:server && webpack --config webpack.server.config.js --progress --colors`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the LiderFinal@0.0.0 build:server:prod script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/apple/.npm/_logs/2019-05-08T21_58_08_088Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! LiderFinal@0.0.0 build:prod: `npm run build:server:prod && npm run build:browser:prod`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the LiderFinal@0.0.0 build:prod script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/apple/.npm/_logs/2019-05-08T21_58_08_119Z-debug.log

Когда я удаляю импорт и использую 'any' какИдентификатор типа по переменным, все работает.но это раздражает, и я думаю, что именно поэтому мы используем TS ... Любая помощь приветствуется, у меня большие проблемы ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...