Reuse Components Across PowerApps With A Component Library

Update 7/8/21: Importing and exporting individual components is being deprecated by Microsoft. So while the majority of this post is still valid, exporting from the first app and importing it into the component library will be deprecated. You should create the components directly in the component library when you want to use them across apps.

Create a Component Library

To create a `Component Library`, first go to https://make.powerapps.com, click on `Apps`, select the `Component Libraries` tab and then click `Create component library`.

‍

Some things to note about a component library… Screens exist for preview purposes only, the Play button is disabled, and Component libraries are not accessible from a mobile device.

Exporting a Component

Now, instead of creating a New component, we are going to export the `ApplicationHeader` component from our previous app and import it to our `Component library`. Back in the `Components` tab of the tree view in the previous application, click the ellipses next to `New component` and click `Export components`.

‍

This will result in a file download. Click `Download` and remember where you saved the file.

Import a Component

Next, let's switch back to the new `Component library` we created and in the `Components tab` of the tree view, click `Import components`.

‍

This will open a panel with a list of applications you have access to that also have components defined within. In our case we are going to import from the file we just saved to click `Upload file`.

‍

Select the file that you exported earlier. Once imported you should have your components listed

‍

Make any adjustments you need to the components and then `Save and Publish` the component library. Note, the library will not be available unless it is published.

Using a Component Library

Now, the next time you create a new application or open an existing one for edit, you can import components from the library by clicking on the `Insert` tab and then clicking `Get more components`.

‍

This will give you a list of components from the published libraries in your environment.

‍

Select `ApplicationHeader` and click Import.

‍

Now the `ApplicationHeader` will show up under `Library components` on the `Insert` tab.

‍

Now you can add the `Application Header` to your new application screens.

‍

One of the added benefits of this technique is that Application Owners are notified whenever updates are made to components in the library. Component developers can add version notes which are useful for review by App developers in evaluating the changes that are applied and how to reconcile them within their applications.

Conclusion

This concludes our series on "How to Speed Up Your PowerApps Development", so if you missed any of those posts, be sure to check them out! We think this is a great option to standardize PowerApps across your organization and make them quick to produce.