Static-web-apps: Detect Angular app and build with ng build --prod

Created on 26 May 2020  路  3Comments  路  Source: Azure/static-web-apps

Referring to the issue I had with an Angular deployment (#31) where it was built using npm run build and resulted in the app attempting to connect to local websocket, rather than published websocket and reloading page after some failed attempts, I would like to suggest SWA service recognise Angular projects and build them with ng build --prod by default to avoid getting any user of SWA service to failing to update package.json or NPM scripts to get the same behaviour.

Most helpful comment

Hi @mahmoudajawad thanks for opening this issue.

The default configuration that the Angular CLI generates when scaffolding a project, would have an npm run build script that executes a non-production build of your app, ieng build.

Please note that the --prod is a shorthand for "--configuration=production". When true, it sets the build configuration to the production target (in the angular.json).

A lot of Angular projects can have many different target builds, not only production. Given this assumption, SWA can't explicitly run the ng build --prod since the developer may want to run a build against a different target/configuration using SWA.

This is why, SWA only executes the npm run build script (or npm run build:azure). The developer may then need to update their package.json in order to execute the desired target/configuration.

For more advanced scenarios, you can provide SWA with a custom build command (for both the app and the api) by using the app_build_command (and api_build_command). Here is an example from a real world app:

image

All 3 comments

Hi @mahmoudajawad thanks for opening this issue.

The default configuration that the Angular CLI generates when scaffolding a project, would have an npm run build script that executes a non-production build of your app, ieng build.

Please note that the --prod is a shorthand for "--configuration=production". When true, it sets the build configuration to the production target (in the angular.json).

A lot of Angular projects can have many different target builds, not only production. Given this assumption, SWA can't explicitly run the ng build --prod since the developer may want to run a build against a different target/configuration using SWA.

This is why, SWA only executes the npm run build script (or npm run build:azure). The developer may then need to update their package.json in order to execute the desired target/configuration.

For more advanced scenarios, you can provide SWA with a custom build command (for both the app and the api) by using the app_build_command (and api_build_command). Here is an example from a real world app:

image

@manekinekMA, amazing! Having the option for custom build command is even better. I overlooked this one. Thanks for explaining it.

You are welcome @mahmoudajawad

Was this page helpful?
0 / 5 - 0 ratings