How to change remote url in build

[Ronaldo Hoch]

Hi guys, i need to ask a newbie question 🤦

  {
    path:'mfe1',
    loadChildren: () =>
      loadRemoteModule({
        type: 'module',
        remoteEntry: 'http://localhost:4201/remoteEntry.js',
        exposedModule: './routes'
      })
      .then(m => m.mfe1Routes)
  },

I have 3 environment here in my job.
Local, a remote version in a server to use with VPN and production.

Since angular has removed the environment, how can I change the url for remoteEntry.

Can be using type: 'module' or type 'manifest'.

Would like to have a dev build that points like this:

  {
    path:'mfe1',
    loadChildren: () =>
      loadRemoteModule({
        type: 'module',
        remoteEntry: 'http://my.remote.server/new/mfe/mfe1/remoteEntry.js',
        exposedModule: './routes'
      })
      .then(m => m.mfe1Routes)
  },

and a production that points like this:

  {
    path:'mfe1',
    loadChildren: () =>
      loadRemoteModule({
        type: 'module',
        remoteEntry: 'http://productionurl.com/new/mfe/mfe1/remoteEntry.js',
        exposedModule: './routes'
      })
      .then(m => m.mfe1Routes)
  },

[Michael Wolbert]

What I tend to do, is;

1. create a route file per environment (ie app.routes.ts, app.routes.dev.ts, app.routes.test.ts ...)
2. for each environment add a confguration to your build target

arcitect: {
  build: {
    ...
    configuration: {
        production: {},
        development: {},
        test: {},
      }
    }
  ...
}

3. for each configuration add fileReplacements to move your enviroment specific routes to final file for build (app,routes)

configurations: {
  development: {
    fileReplacements: [
      {
        "replace": "apps/shell/src/app/app.routes.ts",
        "with": apps/shell/src/app/app.routes.dev.ts
       }
    ]
  }
}

Pattern is similar to Angular CLI's environment,ts inclusion.

Cheers!

[Ronaldo Hoch]

Thank you, i'll implement this asap :D