AngularUniversal prerendering error: UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'
AngularUniversal prerendering error: UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'
目标
问题看起来很啰嗦 - 事实并非如此!
我正在使用 Angular Universal 来实现 SSR,紧随其后 tutorial。安装了Universal/express-engine,在dist/projectname/server
文件夹中生成了main.js
,我在项目根目录下创建了一个prerender.js
文件夹。
问题
当我尝试 npm run prerender
时,它开始进行预渲染,直到最终遇到以下错误:
Prerendering 5 route(s) to C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\browser
(node:27236) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:27236) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:28592) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:1236) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:27236) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:28592) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:1236) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:29420) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:32908) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:28592) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:1236) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:29420) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:32908) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:29420) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:32908) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
期望的结果
预渲染我们主要 HTML 路线的 HTML,并将其输出到文本文件。
我试过的
This: 删除 main.ts
中 bootstrap 的链式 .catch(err...)
函数 - 同样的错误
This:删除节点模块,package.json,运行 npm install
,ng build
,ng serve
- 同样的错误,还有 package.json
没有像建议的答案那样重新生成,我想我已经破坏了我的应用程序
This:更新 AngularCLI 和 Webpack - 同样的错误
版本
Angular CLI: 10.0.0
Node: 12.16.3
OS: win32 x64
Angular: 10.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router
Ivy Workspace: <error>
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.900.7
@angular-devkit/build-angular 0.901.9
@angular-devkit/build-optimizer 0.901.9
@angular-devkit/build-webpack 0.901.9
@angular-devkit/core 9.0.7
@angular-devkit/schematics 10.0.0
@angular/cdk 9.2.4
@angular/fire 6.0.2
@ngtools/webpack 9.1.9
@nguniversal/builders 9.1.1
@nguniversal/common 9.1.1
@nguniversal/express-engine 9.1.1
@schematics/angular 10.0.0
@schematics/update 0.1000.0
rxjs 6.5.5
typescript 3.9.5
webpack 4.43.0
文件
- prerender.ts
import 'zone.js/dist/zone-node';
import 'reflect-metadata';
import {renderModuleFactory} from '@angular/platform-server';
import {writeFileSync} from 'fs';
const {AppServerModuleNgFactory} = require('./dist/hibernio/server/main');
renderModuleFactory(AppServerModuleNgFactory, {
document: '<app-root></app-root>',
url: '/'
})
.then(html => {
console.log('Pre-rendering successful, saving prerender.html');
writeFileSync('./prerender.html', html);
})
.catch(error => {
console.error('Error occurred:', error);
});
- server.ts
import 'zone.js/dist/zone-node';
import { ngExpressEngine } from '@nguniversal/express-engine';
import * as express from 'express';
import { join } from 'path';
import { AppServerModule } from './src/main.server';
import { APP_BASE_HREF } from '@angular/common';
import { existsSync } from 'fs';
// The Express app is exported so that it can be used by serverless Functions.
export function app() {
const server = express();
const distFolder = join(process.cwd(), 'dist/hibernio/browser');
const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
server.engine('html', ngExpressEngine({
bootstrap: AppServerModule,
}));
server.set('view engine', 'html');
server.set('views', distFolder);
// Example Express Rest API endpoints
// server.get('/api/**', (req, res) => { });
// Serve static files from /browser
server.get('*.*', express.static(distFolder, {
maxAge: '1y'
}));
// All regular routes use the Universal engine
server.get('*', (req, res) => {
res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
});
return server;
}
function run() {
const port = process.env.PORT || 4000;
// Start up the Node server
const server = app();
server.listen(port, () => {
console.log(`Node Express server listening on http://localhost:${port}`);
});
}
// Webpack will replace 'require' with '__webpack_require__'
// '__non_webpack_require__' is a proxy to Node 'require'
// The below code is to ensure that the server is run only when not requiring the bundle.
declare const __non_webpack_require__: NodeRequire;
const mainModule = __non_webpack_require__.main;
const moduleFilename = mainModule && mainModule.filename || '';
if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
run();
}
export * from './src/main.server';
- 主.server.ts
import { enableProdMode } from '@angular/core';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
export { AppServerModule } from './app/app.server.module';
export { renderModule, renderModuleFactory } from '@angular/platform-server';
- tsconfig.server.json
{
"extends": "./tsconfig.app.json",
"compilerOptions": {
"outDir": "./out-tsc/app-server",
"module": "commonjs",
"types": [
"node"
]
},
"files": [
"src/main.server.ts",
"server.ts"
],
"angularCompilerOptions": {
"entryModule": "./src/app/app.server.module#AppServerModule"
}
}
- angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"hibernio": {
"projectType": "application",
"schematics": {},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/hibernio/browser",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"aot": true,
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss",
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"node_modules/bootstrap/dist/js/bootstrap.bundle.min.js",
"node_modules/@fortawesome/fontawesome-free/css/all.css",
"node_modules/ngx-sharebuttons/themes/circles/circles-dark-theme.scss"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js"
]
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "hibernio:build"
},
"configurations": {
"production": {
"browserTarget": "hibernio:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "hibernio:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.css"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "hibernio:serve"
},
"configurations": {
"production": {
"devServerTarget": "hibernio:serve:production"
}
}
},
"deploy": {
"builder": "@angular/fire:deploy",
"options": {}
},
"server": {
"builder": "@angular-devkit/build-angular:server",
"options": {
"outputPath": "dist/hibernio/server",
"main": "server.ts",
"tsConfig": "tsconfig.server.json"
},
"configurations": {
"production": {
"outputHashing": "media",
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"sourceMap": false,
"optimization": true
}
}
},
"serve-ssr": {
"builder": "@nguniversal/builders:ssr-dev-server",
"options": {
"browserTarget": "hibernio:build",
"serverTarget": "hibernio:server"
},
"configurations": {
"production": {
"browserTarget": "hibernio:build:production",
"serverTarget": "hibernio:server:production"
}
}
},
"prerender": {
"builder": "@nguniversal/builders:prerender",
"options": {
"browserTarget": "hibernio:build:production",
"serverTarget": "hibernio:server:production",
"routes": [
"/"
]
},
"configurations": {
"production": {}
}
}
}
}
},
"defaultProject": "hibernio"
}
- package.json
{
"name": "hibernio",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"dev:ssr": "ng run hibernio:serve-ssr",
"serve:ssr": "node dist/hibernio/server/main.js",
"build:ssr": "ng build --prod && ng run hibernio:server:production",
"prerender": "ng run hibernio:prerender"
},
"private": true,
"dependencies": {
"@angular/animations": "~9.1.7",
"@angular/cdk": "^9.2.4",
"@angular/common": "~9.1.7",
"@angular/compiler": "~9.1.7",
"@angular/core": "~9.1.7",
"@angular/fire": "^6.0.0",
"@angular/forms": "~9.1.7",
"@angular/platform-browser": "~9.1.7",
"@angular/platform-browser-dynamic": "~9.1.7",
"@angular/platform-server": "~9.1.7",
"@angular/router": "~9.1.7",
"@fortawesome/angular-fontawesome": "^0.6.1",
"@fortawesome/fontawesome-free": "^5.13.1",
"@fortawesome/fontawesome-svg-core": "^1.2.29",
"@fortawesome/free-brands-svg-icons": "^5.13.1",
"@fortawesome/free-regular-svg-icons": "^5.13.0",
"@fortawesome/free-solid-svg-icons": "^5.13.1",
"@nguniversal/express-engine": "^9.1.1",
"angular-font-awesome": "^3.1.2",
"bootstrap": "^4.5.0",
"express": "^4.15.2",
"jquery": "^3.5.1",
"mdbootstrap": "^4.19.0",
"ngx-sharebuttons": "^8.0.0",
"rxjs": "~6.5.4",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.901.6",
"@angular/cli": "~9.1.6",
"@angular/compiler-cli": "~9.1.7",
"@nguniversal/builders": "^9.1.1",
"@types/express": "^4.17.0",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"@types/jquery": "^3.3.38",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "~3.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"protractor": "~5.4.3",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~3.8.3",
"webpack": "^4.43.0",
"@angular-devkit/architect": "~0.900",
"firebase-tools": "^8.0.0",
"fuzzy": "^0.1.3",
"inquirer": "^6.2.2",
"inquirer-autocomplete-prompt": "^1.0.1"
}
}
更新
David 发现 Ivy 有错误。然后我在 tsconfig.json
> compilerOptions
> enableIvy
中启用了常春藤,它抛出了一堆错误 re fontawesome:
Warning: Invalid constructor parameter decorator in C:/Users/odubh/Documents/Personal_Web_Projects/Hibernio.com/Hibernio0.3/hibernio/node_modules/angular-font-awesome/dist/angular-font-awesome.js:
function () { return [
{ type: LocationStrategy, },
]; }
我以前在实现 fontawesome 时不得不禁用 Ivy,因为它们似乎一起导致错误,而 Whosebug 的解决方案似乎是禁用 Ivy。现在我需要 Ivy 来实现 Universal,但我不知道该怎么做才能让这两个包一起工作——最好启用 Ivy,因为这似乎是推荐的。
感谢 David 发现 Ivy 问题。
您需要启用 Ivy 才能解决第一个问题 (No NgModule found ...
)。
对于第二个(Invalid constructor parameter decorator
),原因可能是您正在使用 angular-font-awesome
,它不再维护并且不适用于 Ivy
因此请卸载该软件包 (npm uninstall angular-font-awesome -S
) 并仅保留 fortawesome
个软件包:
"@fortawesome/angular-fontawesome": "^0.6.1",
"@fortawesome/fontawesome-free": "^5.13.1",
"@fortawesome/fontawesome-svg-core": "^1.2.29",
"@fortawesome/free-brands-svg-icons": "^5.13.1",
"@fortawesome/free-regular-svg-icons": "^5.13.0",
"@fortawesome/free-solid-svg-icons": "^5.13.1",
注意:正如我在评论中所说,我认为您不需要创建 prerender.ts
文件。您可以只添加路由以渲染到 angular.json
和 运行 ng run prerender
目标
问题看起来很啰嗦 - 事实并非如此!
我正在使用 Angular Universal 来实现 SSR,紧随其后 tutorial。安装了Universal/express-engine,在dist/projectname/server
文件夹中生成了main.js
,我在项目根目录下创建了一个prerender.js
文件夹。
问题
当我尝试 npm run prerender
时,它开始进行预渲染,直到最终遇到以下错误:
Prerendering 5 route(s) to C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\browser
(node:27236) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:27236) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:28592) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:1236) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:27236) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:28592) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:1236) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:29420) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:32908) UnhandledPromiseRejectionWarning: Error: No NgModule metadata found for 'class{}'.
at NgModuleResolver.resolve (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:628845)
at CompileMetadataResolver.getNgModuleMetadata (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:603430)
at JitCompiler._loadModules (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:672203)
at JitCompiler._compileModuleAndComponents (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:671712)
at JitCompiler.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:670635)
at useClass.compileModuleAsync (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2063708)
at compileNgModuleFactory__PRE_R3__ (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1372200)
at PlatformRef.bootstrapModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:1376714)
at renderModule (C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\dist\hibernio\server\main.js:1:2085795)
at C:\Users\odubh\Documents\Personal_Web_Projects\Hibernio.com\Hibernio0.3\hibernio\node_modules\@nguniversal\builders\src\prerender\render.js:66:32
(node:28592) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:1236) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:29420) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:32908) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:29420) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:32908) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
期望的结果
预渲染我们主要 HTML 路线的 HTML,并将其输出到文本文件。
我试过的
This: 删除 main.ts
中 bootstrap 的链式 .catch(err...)
函数 - 同样的错误
This:删除节点模块,package.json,运行 npm install
,ng build
,ng serve
- 同样的错误,还有 package.json
没有像建议的答案那样重新生成,我想我已经破坏了我的应用程序
This:更新 AngularCLI 和 Webpack - 同样的错误
版本
Angular CLI: 10.0.0
Node: 12.16.3
OS: win32 x64
Angular: 10.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router
Ivy Workspace: <error>
Package Version
-----------------------------------------------------------
@angular-devkit/architect 0.900.7
@angular-devkit/build-angular 0.901.9
@angular-devkit/build-optimizer 0.901.9
@angular-devkit/build-webpack 0.901.9
@angular-devkit/core 9.0.7
@angular-devkit/schematics 10.0.0
@angular/cdk 9.2.4
@angular/fire 6.0.2
@ngtools/webpack 9.1.9
@nguniversal/builders 9.1.1
@nguniversal/common 9.1.1
@nguniversal/express-engine 9.1.1
@schematics/angular 10.0.0
@schematics/update 0.1000.0
rxjs 6.5.5
typescript 3.9.5
webpack 4.43.0
文件
- prerender.ts
import 'zone.js/dist/zone-node';
import 'reflect-metadata';
import {renderModuleFactory} from '@angular/platform-server';
import {writeFileSync} from 'fs';
const {AppServerModuleNgFactory} = require('./dist/hibernio/server/main');
renderModuleFactory(AppServerModuleNgFactory, {
document: '<app-root></app-root>',
url: '/'
})
.then(html => {
console.log('Pre-rendering successful, saving prerender.html');
writeFileSync('./prerender.html', html);
})
.catch(error => {
console.error('Error occurred:', error);
});
- server.ts
import 'zone.js/dist/zone-node';
import { ngExpressEngine } from '@nguniversal/express-engine';
import * as express from 'express';
import { join } from 'path';
import { AppServerModule } from './src/main.server';
import { APP_BASE_HREF } from '@angular/common';
import { existsSync } from 'fs';
// The Express app is exported so that it can be used by serverless Functions.
export function app() {
const server = express();
const distFolder = join(process.cwd(), 'dist/hibernio/browser');
const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
server.engine('html', ngExpressEngine({
bootstrap: AppServerModule,
}));
server.set('view engine', 'html');
server.set('views', distFolder);
// Example Express Rest API endpoints
// server.get('/api/**', (req, res) => { });
// Serve static files from /browser
server.get('*.*', express.static(distFolder, {
maxAge: '1y'
}));
// All regular routes use the Universal engine
server.get('*', (req, res) => {
res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
});
return server;
}
function run() {
const port = process.env.PORT || 4000;
// Start up the Node server
const server = app();
server.listen(port, () => {
console.log(`Node Express server listening on http://localhost:${port}`);
});
}
// Webpack will replace 'require' with '__webpack_require__'
// '__non_webpack_require__' is a proxy to Node 'require'
// The below code is to ensure that the server is run only when not requiring the bundle.
declare const __non_webpack_require__: NodeRequire;
const mainModule = __non_webpack_require__.main;
const moduleFilename = mainModule && mainModule.filename || '';
if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
run();
}
export * from './src/main.server';
- 主.server.ts
import { enableProdMode } from '@angular/core';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
export { AppServerModule } from './app/app.server.module';
export { renderModule, renderModuleFactory } from '@angular/platform-server';
- tsconfig.server.json
{
"extends": "./tsconfig.app.json",
"compilerOptions": {
"outDir": "./out-tsc/app-server",
"module": "commonjs",
"types": [
"node"
]
},
"files": [
"src/main.server.ts",
"server.ts"
],
"angularCompilerOptions": {
"entryModule": "./src/app/app.server.module#AppServerModule"
}
}
- angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"hibernio": {
"projectType": "application",
"schematics": {},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/hibernio/browser",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"aot": true,
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.scss",
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"node_modules/bootstrap/dist/js/bootstrap.bundle.min.js",
"node_modules/@fortawesome/fontawesome-free/css/all.css",
"node_modules/ngx-sharebuttons/themes/circles/circles-dark-theme.scss"
],
"scripts": [
"node_modules/jquery/dist/jquery.min.js"
]
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "6kb",
"maximumError": "10kb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "hibernio:build"
},
"configurations": {
"production": {
"browserTarget": "hibernio:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "hibernio:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.css"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "hibernio:serve"
},
"configurations": {
"production": {
"devServerTarget": "hibernio:serve:production"
}
}
},
"deploy": {
"builder": "@angular/fire:deploy",
"options": {}
},
"server": {
"builder": "@angular-devkit/build-angular:server",
"options": {
"outputPath": "dist/hibernio/server",
"main": "server.ts",
"tsConfig": "tsconfig.server.json"
},
"configurations": {
"production": {
"outputHashing": "media",
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"sourceMap": false,
"optimization": true
}
}
},
"serve-ssr": {
"builder": "@nguniversal/builders:ssr-dev-server",
"options": {
"browserTarget": "hibernio:build",
"serverTarget": "hibernio:server"
},
"configurations": {
"production": {
"browserTarget": "hibernio:build:production",
"serverTarget": "hibernio:server:production"
}
}
},
"prerender": {
"builder": "@nguniversal/builders:prerender",
"options": {
"browserTarget": "hibernio:build:production",
"serverTarget": "hibernio:server:production",
"routes": [
"/"
]
},
"configurations": {
"production": {}
}
}
}
}
},
"defaultProject": "hibernio"
}
- package.json
{
"name": "hibernio",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"dev:ssr": "ng run hibernio:serve-ssr",
"serve:ssr": "node dist/hibernio/server/main.js",
"build:ssr": "ng build --prod && ng run hibernio:server:production",
"prerender": "ng run hibernio:prerender"
},
"private": true,
"dependencies": {
"@angular/animations": "~9.1.7",
"@angular/cdk": "^9.2.4",
"@angular/common": "~9.1.7",
"@angular/compiler": "~9.1.7",
"@angular/core": "~9.1.7",
"@angular/fire": "^6.0.0",
"@angular/forms": "~9.1.7",
"@angular/platform-browser": "~9.1.7",
"@angular/platform-browser-dynamic": "~9.1.7",
"@angular/platform-server": "~9.1.7",
"@angular/router": "~9.1.7",
"@fortawesome/angular-fontawesome": "^0.6.1",
"@fortawesome/fontawesome-free": "^5.13.1",
"@fortawesome/fontawesome-svg-core": "^1.2.29",
"@fortawesome/free-brands-svg-icons": "^5.13.1",
"@fortawesome/free-regular-svg-icons": "^5.13.0",
"@fortawesome/free-solid-svg-icons": "^5.13.1",
"@nguniversal/express-engine": "^9.1.1",
"angular-font-awesome": "^3.1.2",
"bootstrap": "^4.5.0",
"express": "^4.15.2",
"jquery": "^3.5.1",
"mdbootstrap": "^4.19.0",
"ngx-sharebuttons": "^8.0.0",
"rxjs": "~6.5.4",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.901.6",
"@angular/cli": "~9.1.6",
"@angular/compiler-cli": "~9.1.7",
"@nguniversal/builders": "^9.1.1",
"@types/express": "^4.17.0",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"@types/jquery": "^3.3.38",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "~3.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"protractor": "~5.4.3",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~3.8.3",
"webpack": "^4.43.0",
"@angular-devkit/architect": "~0.900",
"firebase-tools": "^8.0.0",
"fuzzy": "^0.1.3",
"inquirer": "^6.2.2",
"inquirer-autocomplete-prompt": "^1.0.1"
}
}
更新
David 发现 Ivy 有错误。然后我在 tsconfig.json
> compilerOptions
> enableIvy
中启用了常春藤,它抛出了一堆错误 re fontawesome:
Warning: Invalid constructor parameter decorator in C:/Users/odubh/Documents/Personal_Web_Projects/Hibernio.com/Hibernio0.3/hibernio/node_modules/angular-font-awesome/dist/angular-font-awesome.js:
function () { return [
{ type: LocationStrategy, },
]; }
我以前在实现 fontawesome 时不得不禁用 Ivy,因为它们似乎一起导致错误,而 Whosebug 的解决方案似乎是禁用 Ivy。现在我需要 Ivy 来实现 Universal,但我不知道该怎么做才能让这两个包一起工作——最好启用 Ivy,因为这似乎是推荐的。
感谢 David 发现 Ivy 问题。
您需要启用 Ivy 才能解决第一个问题 (No NgModule found ...
)。
对于第二个(Invalid constructor parameter decorator
),原因可能是您正在使用 angular-font-awesome
,它不再维护并且不适用于 Ivy
因此请卸载该软件包 (npm uninstall angular-font-awesome -S
) 并仅保留 fortawesome
个软件包:
"@fortawesome/angular-fontawesome": "^0.6.1",
"@fortawesome/fontawesome-free": "^5.13.1",
"@fortawesome/fontawesome-svg-core": "^1.2.29",
"@fortawesome/free-brands-svg-icons": "^5.13.1",
"@fortawesome/free-regular-svg-icons": "^5.13.0",
"@fortawesome/free-solid-svg-icons": "^5.13.1",
注意:正如我在评论中所说,我认为您不需要创建 prerender.ts
文件。您可以只添加路由以渲染到 angular.json
和 运行 ng run prerender