Standalone components err: 'imports' must be an array of components, directives, pipes, or NgModules | Angular Community | Page 1

Hi,
I have an nx project that I build for production using @nx/angular:webpack-browser executor and for local development using @angular-devkit/build-angular:dev-server
I'm using standalone components and I've grouped them inside an array.

const components = [
  FirstComponent,
  SecondComponent,
];

const directives = [FirstDirective, SecondDirective];

export const APP_DIRECTIVES = [...components, ...directives] as const;

Inside my standalone component I import them like this:

@Component({  
  selector: 'my-app',
  templateUrl: './my-app.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
  standalone: true,
  imports: [...APP_DIRECTIVES ]
})
export class MyAppComponent {}

If I build this for local development it works as expected, but if I build it for production I get 'imports' must be an array of components, directives, pipes, or NgModules. Value is of type '[(not statically analyzable)]'.

Standalone components: 'imports' must be an array of components, directives, pipes, or NgModules

Standalone components err: 'imports' must be an array of components, directives, pipes, or NgModules

#Standalone components err: 'imports' must be an array of components, directives, pipes, or NgModules