To make my app universal I need to import @ng-toolkit/universal
.
But, this installation not worked in angular versions from 10.
This is because, a project.ts
file is missing in node_modules/schematics/angular
.
To fix this the most recent version (9.1.15) that supports @ng-toolkit/universal
is imported and Then the @ng-toolkit/universal package
is installed successfully.
Then I build my project using npm run build:prod
command. It creates the build without rising issue. Next I run the project using npm run server
command. It also run successfully.
When I run the URL in my browser, it shows the error as follows
Error: You must pass in a NgModule or NgModuleFactory to be bootstrapped at View.engine (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:46927:23) at View.render (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:135990:8) at tryRender (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:132040:10) at Function.render (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:131992:3) at ServerResponse.render (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:143601:7) at C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:137:9 at Layer.handle [as handle_request] (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:135418:5) at next (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:134339:13) at Route.dispatch (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:134314:3) at Layer.handle [as handle_request] (C:\Users\dell\rithicka_learning\testeee\module\dist\server.js:135418:5)
The package.json
file is as follows:
{
"name": "module",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"compile:server": "webpack --config webpack.server.config.js --progress --colors",
"serve:ssr": "node local.js",
"build:ssr": "npm run build:client-and-server-bundles && npm run compile:server",
"build:client-and-server-bundles": "ng build --prod && ng run module:server:production",
"server": "node local.js",
"build:prod": "npm run build:ssr"
},
"private": true,
"dependencies": {
"@angular-devkit/schematics": "^9.1.15",
"@angular/animations": "~10.2.0",
"@angular/common": "~10.2.0",
"@angular/compiler": "~10.2.0",
"@angular/core": "~10.2.0",
"@angular/forms": "~10.2.0",
"@angular/platform-browser": "~10.2.0",
"@angular/platform-browser-dynamic": "~10.2.0",
"@angular/platform-server": "~10.2.0",
"@angular/router": "~10.2.0",
"@ng-toolkit/universal": "^7.1.0",
"@nguniversal/common": "0.0.0",
"@nguniversal/express-engine": "^10.1.0",
"@nguniversal/module-map-ngfactory-loader": "0.0.0",
"@schematics/angular": "^9.1.15",
"express": "^4.15.2",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.1002.3",
"@angular/cli": "~10.2.0",
"@angular/compiler-cli": "~10.2.0",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-loader": "^5.2.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2",
"webpack-cli": "^3.1.0"
}
}