How to change remote url in build

[ronaldohoch]

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)
  },

[mchlbrnd]

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!

[ronaldohoch]

Thank you, i'll implement this asap :D