I want to implement angular universal, for that I have gone through this entire tutorial and setup the app. https://angular.io/guide/universal
I'm able to build the app but when I serve the app I get an error that it can find any view in 'dist/browser', this is because as, my browser folder is itself not generating. I tried changing the route from 'dist/browser' to just 'dist' and the app worked, although I don't think this is the expected thing to do.
Here's a snippet of my angular-cli.json file if that helps
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "angular5"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.css"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
},
{
"platform": "server",
"root": "src",
"outDir": "dist/server",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.server.ts",
"test": "test.ts",
"tsconfig": "tsconfig.server.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"styles.css"
],
"scripts": [],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"defaults": {
"styleExt": "css",
"component": {}
}
}
How can I get my browser folder to render and make it work properly?
In your first app, you actually need to change outDir
to dist/browser
instead of just dist
Regarding your index.html
file, it's normal that you don't see it in the dist/server
folder, your universal server will be using the one for the dist/browser folder
Have a look here, the steps are explained quite clearly https://github.com/angular/angular-cli/wiki/stories-universal-rendering