Compatibility of @ngx-env/builder with Angular 18

[ebiton-eig]

@ngx-env/builder does not support Angular 18.

>example@4.2.4 start
> ng serve

---------------------------------
- Root directory:  F:\source\example
- Working directory:  F:\source\example
- Files: .env
- Environment: development
- Environment files:
 ✔ F:\source\example\.env
- Environment variables: NG_APP
 ✔ NG_APP_API_URL
 ✔ NG_APP_AUTH_URL
 ✔ NG_APP_CONNECTOR_URL
 ✔ NG_APP_GATEWAY_URL
---------------------------------

Error: Schema validation failed with the following errors:
  Data path "" must NOT have additional properties(ngxEnv).

[ebiton-eig]

The problem only arises in SSR. Migration to Angular 18 modifies Angular.json and replaces "builder": "@angular-devkit/build-angular:browser", with "builder": "@angular-devkit/build-angular:application". This migration obviously fails if you're already using "builder": "@ngx-env/builder:browser".

If you leave "browser", you get the first error I mentioned. If you try to use "application", you get another error:

Error: Schema validation failed with the following errors: Data path "" must have required property 'browser'.

[Frankitch]

I am facing the same situation, in a NX monorepo context and no SSR in my case :

 // in /app/my-app/project.json
 "build": {
      "executor": "@ngx-env/builder:application",
       ...
       }

With this setup the error is also Data path "" must NOT have additional properties(ngxEnv).

@ebiton-eig if you came across Data path "" must have required property 'browser', you might want to replace the main property in your angular.json by the browser property.

[janek64]

I can confirm that @ngx-env/builder:browser and @ngx-env/builder:browser-esbuild work as expected, but @ngx-env/builder:application fails.

Opposite to the comment made by @ebiton-eig, this is also relevant for Angular projects that do not use SSR because this builder enables Vite.

Is there anything else we can do to help with resolving this issue?

[chihab]

Thanks for your input guys. I am on it, some internals have changed... (new @angular/build package). Trying to figure that out.

[chihab]

Could you please give npx ng add @ngx-env/builder@18.0.0 a try?

[ebiton-eig]

Perfect, it works for me !

[BigWhiteTiger]

I am still facing the issue with @18.0.0, running into

Error: Job Output failed to validate. Errors: Data path "" must have required property 'success'.

while running ng serve with following setting "builder": "@ngx-env/builder:dev-server",

But the ng build is working now ("builder": "@ngx-env/builder:browser",).

[janek64]

@ngx-env/builder:application is working correctly with 18.0.0 for me. Thank you for the quick fix!

[chihab]

@BigWhiteTiger could you try removing the build cache .angular, remove node_modules and run npm install.

If none of those work, It'd help to have a minimal repo reproducing the issue.

[janek64]

One update, I think i found an issue, but I am not sure if its related to this dependency. When I use ng serve and the build of the application is not possible due an error, e.g. by importing a non-existant file in an .scss file, the development server seems to hang up. The Building... message disappears and nothign happens. The application is not accessible. When building with ng build, I can see the root cause instead.

If this is not related to these changes, I can create a new ticket with a reproducer when I find time for it.

[BigWhiteTiger]

@chihab I have done that but the issue still exits, but only in a certain repo. I have tried the same in another playground repo of mine and it works with 18.0.0.

So it is a missconfiguration I think. I think the problem is that I cannot load the Environment correctly, it is none. `

• Root directory: C:\Users...\project
• Working directory: C:\Users...\project
• Files: .env
• Environment: none
• Environment files: `

In my working repo I have a Environment: development

But this seems to be another issue I will hopefully find a solution for.

Thanks so far.

UPDATE: I found the solution, but it was to use the "builder": "@ngx-env/builder:application",instead of "builder": "@ngx-env/builder:browser",

I ran also in the following error from @ebiton-eig (but I am not intended to use SSR, it was made for client only) Error: Schema validation failed with the following errors: Data path "" must have required property 'browser'. Which you can handle by replacing "main": "src/main.ts" with "browser": "src/main.ts",.

So now I don't know if this issue here is really fixed. I found a workaround, but still think that the browser builder is not working as intended.

I will provide you an repo to the playground I have repoduce the issue.

[BigWhiteTiger]

Now I am running also into the issue @janek64 is describing. It seems the errors of the builder are not displayed anymore (like false types etc.) instead nothing is displayed in the console.

[chihab]

I'll have a look today.

[ebiton-eig]

I have the same kind of problem: when I compile and debug under VSCode, debugging doesn't start until I interrupt ng serve. This is often a sign that the compilation has returned an error code on output, but nothing appears in the console.

[ebiton-eig]

I tried to build a docker image with my application, the build never finishes (I shut down after 35 minutes). I think this is also linked to the problem described above.

[Frankitch]

I'm also facing this issue with NX but I can have more info by adding --verbose. In my case it is a problem of typing, I have multiple applications, and it cannot find for each application the right definition (env.d.ts).

[chihab]

This issue has been solved in 18.0.1.

Let me know when it is all good.

[ebiton-eig]

Ok for me. The build is completed correctly and VSCode debugging start after it without problem.

I'm checking with docker. It takes a long time. I'll see if it finishes after a while (with Angular 17 it sometimes took 10/15 minutes). It's strange, though, because the build itself is finished in 13433ms, but the step doesn't finish immediately.

[BigWhiteTiger]

Yes @chihab it has also work for me in all scenarios now. I thank you for resolving this :)

[ebiton-eig]

The problem with docker is not related to @ngx-env/builder. So everything's fine!

[chihab]

Cool.

Sorry for the first half-working solution.