feat(angular): disable ngcc when not needed

code/examples/angular-cli/.storybook/main.ts

@@ -34,6 +34,7 @@ const mainConfig: import('@storybook/angular').StorybookConfig = {
     name: '@storybook/angular',
     options: {
       enableIvy: true,
+      enableNgcc: true,
     },
   },
 };

code/frameworks/angular/src/server/framework-preset-angular-ivy.ts

@@ -58,7 +58,9 @@ export const webpack = async (webpackConfig: Configuration, options: PresetOptio
     return webpackConfig;
   }
 
-  runNgcc();
+  if(angularOptions.enableNgcc !== false) {
+    runNgcc();
+  }
 
   return {
     ...webpackConfig,

code/frameworks/angular/src/types.ts

@@ -45,5 +45,6 @@ export type StorybookConfig = Omit<
   StorybookConfigFramework;
 
 export interface AngularOptions {
-  enableIvy: boolean;
+  enableIvy?: boolean;
+  enableNgcc?: boolean;
 }

code/lib/cli/src/automigrate/fixes/new-frameworks.test.ts

@@ -196,6 +196,7 @@ describe('new-frameworks fix', () => {
               },
               angularOptions: {
                 enableIvy: true,
+                enableNgcc: true,
               },
             },
           })
@@ -206,6 +207,7 @@ describe('new-frameworks fix', () => {
             dependenciesToRemove: ['@storybook/builder-webpack5', '@storybook/manager-webpack5'],
             frameworkOptions: {
               enableIvy: true,
+              enableNgcc: true,
             },
             builderInfo: {
               name: 'webpack5',

code/lib/telemetry/src/storybook-metadata.test.ts

@@ -123,11 +123,12 @@ describe('await computeStorybookMetadata', () => {
         ...mainJsMock,
         angularOptions: {
           enableIvy: true,
+          enableNgcc: true,
         },
       },
     });
 
-    expect(angularResult.framework).toEqual({ name: 'angular', options: { enableIvy: true } });
+    expect(angularResult.framework).toEqual({ name: 'angular', options: { enableIvy: true, enableNgcc: true } });
   });
 
   test('should separate storybook packages and addons', async () => {

docs/faq.md

@@ -24,6 +24,26 @@ module.exports = {
   },
 };
 ```
+### How can I opt-out of Angular ngcc?
+
+In case you postinstall ngcc, you can disable it:
+
+```javascript
+module.exports = {
+  stories: [
+    /* ... */
+  ],
+  addons: [
+    /* ... */
+  ],
+  framework: {
+    name: '@storybook/angular',
+    options: {
+      enableNgcc: false,
+    },
+  },
+};
+```
 
 Please report any issues related to Ivy in our [GitHub Issue Tracker](https://github.com/storybookjs/storybook/labels/app%3A%20angular) as the support for View Engine will be dropped in a future release of Angular.