When using tree shaking (ng build --prod), some components lose their styling

[bengry]

Some components in Fabric lose styling when served/built using tree shaking (ng build|serve --prod).
These components are at least:

• DatePicker (fab-date-picker)
  • The Calendar within it is unstyled.
• Panel (fab-panel)

---

These seem to happen due to these components using plain Sass and not CSS-in-JS like most of the office-ui-fabric-react lib uses.
Components that use CSS-in-JS are not affected (for example, the text field and the icon in the DatePicker appear fine in a prod build, the calendar inside the popup does not).

The way office-ui-fabric-react works for plain CSS-styled components is that they have an original *.scss file, that's compiled down to a *.js file in the following format (unminified & shorten below for readability):

import { loadStyles } from '@microsoft/load-themed-styles';
loadStyles([
  {
    rawString:
      ".root_c754aea6{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-shadow:none;box-shadow:none;margin:0;padding:0}.root_c754aea6 *::-moz-focus-inner{border:0}.root_c754aea6 *{outline:transparent}.root_c754aea6 *{position:relative}.ms-Fabric--isFocusVisible .root_c754aea6 *:focus:after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border:1px solid ",
  },
  { theme: 'neutralSecondary', defaultValue: '#666666' },
  ...
]);

export var root = 'root_c754aea6';
...

It seems like the Angular CLI prod build removes the call to loadStyles in the code, since I can import these files in the app and access the values of the exported variables (root above, though there are others, depending on the file).

[bengry]

Fixed by #14.