cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
monadobariya
New Member

custom component

I am struggling with integrating the react component into canvas app. I have developed a web application using react.js and i want to host that application to the power app. Could you please guide me on this topic?

 

Thank you

Mona

 

1 ACCEPTED SOLUTION

Accepted Solutions

Hi @monadobariya ,

 

Please follow the following commands to pack your code components. Ensure the solution folder is inside the project folder that has the proj file.

  • npm install
  • mkdir <your Solutions folder>
  • cd <your Solutions folder>
  • pac solution init --publisher-name <enter your publisher name> --publisher-prefix <enter your publisher prefix>
  • pac solution add-reference --path <Path to the root of the sample component>
  • msbuild /t:build /restore

After that, you can find the solution.zip in bin/Debug folder, please check the Size.

Snipaste_2019-12-31_11-14-57.png

Then, import the code component in PowerApps Snipaste_2019-12-31_11-03-29.png

Sik

View solution in original post

4 REPLIES 4
v-siky-msft
Community Support
Community Support

Hi Friend,

 

Thank you so much for your quick response on this topic.

I have followed all steps from the link you have posted to create a react application and I am able to run on-premises this application as per the attached screenshot.

I want to host a react application in the power-app cloud using my Microsoft account.

I already followed the steps to create a solution from that react project and imported it to the power-app cloud. When I add a canvas app to this solution I cannot see any react component on that canvas.

 

In short, if you could guide me on how to host react js application on the power-app cloud environment that would be a great help 

 

Hi @monadobariya ,

 

Please follow the following commands to pack your code components. Ensure the solution folder is inside the project folder that has the proj file.

  • npm install
  • mkdir <your Solutions folder>
  • cd <your Solutions folder>
  • pac solution init --publisher-name <enter your publisher name> --publisher-prefix <enter your publisher prefix>
  • pac solution add-reference --path <Path to the root of the sample component>
  • msbuild /t:build /restore

After that, you can find the solution.zip in bin/Debug folder, please check the Size.

Snipaste_2019-12-31_11-14-57.png

Then, import the code component in PowerApps Snipaste_2019-12-31_11-03-29.png

Sik

View solution in original post

Hi Friend,

 

Thank you once again for helping me to solve this issue.

I have followed all the steps as per your suggestions and I am able to create a solution successfully. 

As well as I am able to import the react component to the canvas app.

 

Thank you for help.

Helpful resources

Announcements
PA User Group

Welcome to the User Group Public Preview

Check out new user group experience and if you are a leader please create your group

Power Apps Community Call

Monthly Power Apps Community Call

Did you miss the call?? Check out the Power Apps Community Call here!

secondImage

Experience what’s next for Power Apps

See the latest Power Apps innovations, updates, and demos from the Microsoft Business Applications Launch Event.

Power Platform ISV STudio

Power Platform ISV Studio

ISV Studio is the go-to Power Platform destination for ISV’s to monitor & manage applications post-AppSource publish.

Top Solution Authors
Top Kudoed Authors
Users online (73,153)