Search code examples
angularwebpackangular-cliangular17esbuild

Angular 17 ESBuild Configuration for environment variables


Just migrated from Angular 15 to the 17. And currently it is possible to build and serve with esbuild instead of webpack. With webpack there was a way use a custom webpack config for things like, enviroment variables: enter image description here Where in webpack.partial.js I can add my enviroment variables. I wasn't able to find something similar for the esbuild. The page is blank and I have this error. Upon search on the main.js the COMMIT_SHA_SHOR or even the package.json version(environment variables ) that I need are still missing

(https://i.sstatic.net/f82DR16t.png)

Below my Angular version: [1]: https://i.sstatic.net/8v8knCTK.png

I've tried this sugggestions but without any results https://github.com/nrwl/nx/issues/22503#issuecomment-2034430649


Solution

  • You are already using a third party tool to customize the webpack config @angular-builders/custom-webpack. Now that you are using ESBuild, you need to use @angular-builders/custom-esbuild instead.

    In ESBuild, you can use define to add environment variables, see the docs.