Forum Discussion

Pieter Veenstra's avatar
Oct 20, 2017

SPFx, Office UI Fabric, Angular/React

Is ngOfficeUIFabric supported in an SPFx web part? This page would suggest not at the moment. Also it has only a limited set of the Office UI Fabric controls, and 0.16.0 build number would suggest immaturity. I had a quick go with it and couldn’t get the controls to load, at least not with any styling.

 

We could look at integrating Office UI Fabric React with AngularJS but this may be complicated. Projects such as ngReact (apparently not very ‘modern’) and react2angular (current build status: failed) claim to do this. Are there any examples of doing this in an SPFx web part project?

 

The Office UI Fabric integration page says they are ‘working to resolve [integration with the full Office UI Fabric stylesheets] as quickly as possible’. Do we have an idea when and what progress might be made? Are we better off constructing our own custom stylesheets to make things look ‘Office’?

1 Reply

  • Supported is such a loaded word :) Is ngOficeUIFabric supported? No... because MSFT doesn't own ngOfficeUIFabric... it's an open source community based project. There are some challenges with conflicting styles in the version we leverage (2.6.4) and the current version.

    IMHO, the current OUIF story is a mess... it's near impossible to keep things clean without some extra work. At Ignite MSFT said they are working to make the core classes work better in SPFx by EOY, but (1) that's just style... no interactive components and (2) IMHO I'll believe it when I see it (that's not a slight to the SPFx guys, that's a slight to the OUIF guys who have a bad track record of this stuff).

    But... watch this space... likely to be some interesting news in November ;)

Resources