Sp-dev-fx-controls-react: Update office-ui-fabric-react version dependency to 6.143.0

[sortegamartin]

Category

[ ] Enhancement
[ ] Bug
[X] Question

Now that spfx 1.8 has been released, are you going to update the version of the OUIFR dependency to 6.143.0?
I have upgraded to spfx 1.8 and I am having problems with the different versions of 'react' loaded:

It would also be nice to have a bundle of the library in a CDN (https://www.jsdelivr.com/package/npm/@pnp/spfx-controls-react) to load it as an external library and thus reduce the size of the bundle

Thanks!

[estruyf]

At the moment there are no plans yet to update OUIF to version 6. As the controls will have to support older projects as well. At the moment there are still other issues in SPFx 1.8.0 which have to be fixed. Once the SP engineering team has pushed out a patch, we can start looking how we can add support for 1.8.0.

About the CDN, that is not a bad idea, but it might not be so simple. Problem would be that all the controls will be bundled in one file and provided via CDN. This means that it will be a much lager bundle, then the controls that you add to your project. Another way could be to use code splitting for the control that you are loading. Check this article for more information:
https://www.vrdmn.com/2018/12/code-splitting-in-sharepoint-framework.html - Now with React 16.7.0, you will also be able to lazy load your control (which also does automatic code splitting)
https://www.eliostruyf.com/using-the-full-potential-of-react-in-sharepoint-framework-1-8-0/. With code splitting, you split the controls in specific bundle files and will be hosted together with the other bundle files.

[Katli95]

As always, love the work going on with these packages!

I want to use the <SearchBox/> from OUIFR but v5.* doesn't have bug fixes that I need for that specific component. Is there any way I could use v6.* OUIFR components in my solution, while also including sp-dev-fx-controls-react?

Any and all help greatly appreciated!

Related thread I have going on over at sp-dev-docs

[deanbot]

@estruyf now that 1.9.1 is out, has updating the ouifr version been reconsidered? At present the installation process is slowed by needing to download 2 separate versions of ouifr (they're about 8mb each).

Thanks!

[Katli95]

@estruyf Hey man, sorry for bugging you about this again and again. Can I use a particular control from v6.* of OUIFR in spite of sp-dev-fx-controls-react using v5.*?

(I've got a spfx v1.9.1 project and therefore OUIFR v6)

[PooLP]

Hi,
Any news for a update to OUIFR v6 ?

Thanks.

[AJIXuMuK]

We’re working on that :)

[dev-a11y]

Any update here?

These packages are quite old and I bet that in most of the currently maintained projects they add unnecessary overhead. It may be that soon developers will start copy&pasting code of some controls from this repo directly to their codebases to avoid having these old dependencies. It would be highly appreciated to have the version of office-ui-fabric-react matching latest one currently being used by Sharepoint Online platform or the one from latest public SPFx package.

What about creating another branch of @pnp/spfx-controls-react package let's say 2.x and breaking support for old projects (similar way as it happened for @pnp/pnpjs)?

[AJIXuMuK]

Hi @dev-a11y,

As I previously mentioned, the work is in progress.
There is a v2 branch that is in dev right now.

SharePoint Framework should provide full support for v7 of OUIFR or Fluent UI. After that we'll finish the work. There is no much sense right now to jump to v6 and in few months to another branch for v7.

By the way, you can still use OUIFR v6 in your projects together with PnP Controls. You don't need to copy the code.

For PnPJS reference it might look a bit easier. But we can't jump to v2 as well as we're using Taxonomy API that is not included in v2.

[dev-a11y]

most likely this issue is now obsolete and can be closed - there is v8 of fleunt ui on it's way; what we have done on our side - we had removed this package from our project as a part of bundle size optimizations as it wasn't acceptable for us to have 3 versions of ui fabric at the same time 😄

[deanbot]

@dev-a11y i would still very much like sp-dev-fx-controls-react to be in step with the official react spfx generator

[AJIXuMuK]

We've updated to v6 to align the Controls with SPFx Yeoman generator.
We'll try to keep this alignment going further.