How configure SSR without CLI ?

[alxpsr]

Hi! I have Angular-app without CLI. But starter-guide say configure angular.json like this:

"architect": {
  "build": { ... }
  "server": {
    "builder": "@angular-devkit/build-angular:server",
    "options": {
      "outputPath": "dist/your-project-name-server",
      "main": "src/main.server.ts",
      "tsConfig": "src/tsconfig.server.json"
    }
  }
}

How can i configure rightly my server-app without it?

[alxpsr]

I found 3 ways:

1. CLI with @angular-devkit/build-angular:server
2. Without CLI, only webpack with @ngtools/webpack
3. Compile only with ngc (i.e https://github.com/bleenco/angular-universal-seed on build:ssr uses only ngc, without any plugins)

What the difference between all this ways?

[alxpsr]

okay, Unfortunately angular-cli does not provide a way to customize the webpack config: https://github.com/angular/angular-cli/issues/1656#issuecomment-239366723

[abhijeet1403]

In order to use custom webpack configuration you need to 'eject' out of cli. Beware though, once you eject you cannot use cli other than ng generate.

[alxpsr]

@abhijeet1403 thank's. But how about disabled "eject feature" in angular 5-6 ? Are there any ways to extract webpack configuration from latest version of angular-cli?

[vtulin]

This article was very helpful for me for using Angular Universal without CLI. https://blog.angular-university.io/angular-universal/

[alxpsr]

@vtulin thank's

[Farqual]

@alxpsr I have the same issue here, trying to get Angular Universal working without Angular CLI.. Have you made some progress on this one, did you succeed using it only with Webpack ?

[nimatrazmjo]

@alxpsr @Farqual, I am looking for it too. please let me know if you guys had any progress.

[Farqual]

@alxpsr @nimatullah I've created a repository where I'm trying to get this working, check my comment on that issue : https://github.com/gdi2290/angular-starter/issues/2000#issuecomment-417852477

Was having a "Error: You must pass in a NgModule or NgModuleFactory to be bootstrapped" error, and now I'm getting a "Error: No NgModule metadata found for '[object Object]'."...

Check out my comment here if you want more informations on this.

@govi2010 seems to know how to do it, I'm hoping he is able to help us somehow !

[alxpsr]

Okay, we did it, see more in https://github.com/alxpsr/angular-universal-without-cli

[vlaco]

I tried using your example but I am getting an error "ERROR in Cannot read property 'map' of undefined" when running webpack --config config/webpack.config.ssr.js --progress... Any ideas where I could be wrong?

[alxpsr]

@vlaco you need to run sequentially three builds with different configs. See - https://github.com/alxpsr/angular-universal-without-cli/blob/master/package.json#L10

[vlaco]

I know, I did that but build:ssr part fails with the mentioned error. I guess it cant create the main bundle properly for some reason.

[alxpsr]

@vlaco hm.. show version of npm and node

[vlaco]

Node v8.12.0 Npm v6.4.1

Could be something down to the code inside the app itself but I have no idea what it even could be....

[alxpsr]

Very strange. I'm testing on node v.10 and node v.8.11, and i not have an error :/ Try magic case - delete and reinstal node-modules:

• rm -rf node_modules
• npm i

[vtulin]

Okay, we did it, see more in https://github.com/alxpsr/angular-universal-without-cli

Thank you!