Repository: storybook
Issue: Does not have 'ɵmod' property for imported modules (Angular 12 library + Storybook 6.4)
Labels: bug,has workaround,angular

**The bug**

While importing any external module to an Angular library Storybook shows "Type XXXModule does not have 'ɵmod' property"

![image](https://user-images.githubusercontent.com/53939191/124424441-b2743280-dd6f-11eb-812b-9114e01a78e8.png)


The same goes for any module that is declared inside the import statement in the root module ( tried Angular Material, NgSelect, highCharts). I ran into this issue after migrating Angular to versions 10,11,12, but as I noticed it behaves the same even in new libraries with the latest Storybook and Angular versions.

**To Reproduce**
Reproduction: https://60e2aab9b11773003b143a38-jpwjdkbhmh.chromatic.com/?path=/story/highcharts--default
GitHub: https://github.com/IvanSkadorva/sb-angular-issue

**System**


   ```
    OS: Windows 10 10.0.19043
    CPU: (8) x64 AMD Ryzen 7 4700U with Radeon Graphics
  Binaries:
    Node: 14.15.0 - C:\Program Files\nodejs\node.EXE
    npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1023.0), Chromium (91.0.864.64)
  npmPackages:
    @storybook/addon-actions: ^6.4.0-alpha.11 => 6.4.0-alpha.11
    @storybook/addon-essentials: ^6.4.0-alpha.11 => 6.4.0-alpha.11
    @storybook/addon-links: ^6.4.0-alpha.11 => 6.4.0-alpha.11
    @storybook/angular: ^6.4.0-alpha.11 => 6.4.0-alpha.11
    @storybook/builder-webpack5: ^6.4.0-alpha.11 => 6.4.0-alpha.11
    @storybook/manager-webpack5: ^6.4.0-alpha.11 => 6.4.0-alpha.11    
```

**Additional context**
lib.module.ts
```
import { NgModule } from '@angular/core';
import { HighchartsChartModule } from 'highcharts-angular';
import { LibComponent } from './lib.component';

@NgModule({
  declarations: [
    LibComponent,
  ],
  imports: [
    HighchartsChartModule
  ],
  exports: [
    LibComponent,
  ],
})
export class LibModule { }
```



lib.component.ts
```

import {Component, Input} from '@angular/core';
import * as Highcharts from 'highcharts';
@Component({
  selector: 'lib',
  template: `
    <highcharts-chart
      [Highcharts]="Highcharts"
      [options]="chartOptions"

      style="width: 100%; height: 400px; display: block;"
    ></highcharts-chart>
    <h1>{{message}}</h1>
  `,
  styles: [
  ]
})
export class LibComponent {
  @Input() message: string = '';
  Highcharts: typeof Highcharts = Highcharts;
  chartOptions: Highcharts.Options = {
    series: [{
      data: [1, 2, 3],
      type: 'line'
    }]
  };
}
```


lib.stories.ts

```
import {moduleMetadata, Meta, Story} from '@storybook/angular';

import { CommonModule } from '@angular/common';
import { LibComponent } from './lib.component';
import {HighchartsChartModule} from "highcharts-angular";

export default {
  component: LibComponent,
  decorators: [
    moduleMetadata({
      declarations: [LibComponent],
      imports: [CommonModule,HighchartsChartModule],
    }),
  ],
  title: 'HighCharts',
} as Meta;

const Template: Story<LibComponent> = args => ({
  props: {
    ...args,
  },
});

export const Default = Template.bind({});
Default.args = {
  message: 'Hello world'
};
```