Angular4. separate renderModuleFactory and front end code

Question

Can we separate renderModuleFactory in angular and Front-end itself? I have a front end project and I want to boost it with power of renderModuleFactory/Platform-server (new Angular Universal)

But I want to Add universal as a separate project.

I want to serve my UI project in one host (S3) but serving renderModuleFactory in another NodeJS server. I want to serve my templates and JS files to NodeJS from that server (S3)

But I get confused, how we can config Platform-server to request files from external hosting?

Any guidance/links very much appreciated

---

ps. Based on this post: https://www.softwarearchitekt.at/post/2017/03/07/server-side-rendering-with-angular-4.aspx in [function ngExpressEngine] we can create our own logic to connect to another server (s3)

is there any easier or more mature solution?

Answer 1

I found a solution

thanks to @FrozenPandaz, in this repo: https://github.com/FrozenPandaz/ng-universal-demo

you can modify the Webpack as following and it will work

In client.config for Webpack

change the output section

  output: {
    path: root('dist'),
    filename: 'static/[name]-[chunkhash].js',
    chunkFilename: 'static/chunk-[chunkhash]-[id].js'
  },

and GlobCopyWebpackPlugin

    new GlobCopyWebpackPlugin({
      patterns: [
        {glob: 'assets', output: 'static'},
        {glob: 'manifest.json', output: 'static'},
        {glob: 'favicon.ico', output: 'static'}
      ],
      globOptions: {
        cwd: root('src'),
        dot: true,
        ignore: '**/.gitkeep'
      }
    }),

it will move client files to a sub directory named static but server side files will be remain in dist folder and index.html will be serverd from NodeJS as expected(becuse of SSR requirements)

in common.config for webpack ExtractTextPlugin should change and prefixed with static again, to move css files to static folder

now all the links and folder structures are correct

static folder can be served from S3 or any other static file hosting other files in dist folder are the minimum files for serving from NodeJS

hope it is helping someone else