Hi,
Common pain point when inheriting environments with undocumented PCF (PowerApps Component Framework) controls. Since the control didn’t appear in the exported solution XML, it likely wasn’t packaged correctly or was deployed manually outside the solution layer.
Here’s a step-by-step recovery and rebuild path:
Step 1: Set Up Your Dev Environment
Make sure you have the following installed:
- Node.js (LTS version)
- Power Platform CLI (
pac)
- Visual Studio Code
- .NET Framework 4.6.2+ (required for CLI)
- Optional: Power Platform Tools extension for VS Code
Step 2: Initialize a New PCF Project
Use Power Platform CLI to scaffold the component:
bash
pac pcf init --namespace <YourNamespace> --name <ComponentName> --template field
Then install dependencies:
bash
npm install
Step 3: Rebuild the Component Logic
Based on your .tsx, .css, and manifest inspection:
- Copy the original TypeScript logic into
index.ts
- Add your CSS styles into a new file and reference it in
ControlManifest.Input.xml
- Reconstruct the manifest file using the tags you found (
control, property, resources, etc.)
Step 4: Test Locally
Run:
bash
npm start
This launches the PCF test harness in your browser. You can debug and validate the control before packaging.
Step 5: Package and Deploy
Authenticate to your target environment:
bash
pac auth create --url https://<your-org>.crm.dynamics.com
Then push the control:
bash
pac pcf push --publisher-prefix <prefix>
This creates a solution with your control and deploys it to Dataverse.
Step 6: Add Control to Entity/Form
In Power Apps:
- Go to the entity or form
- Click Controls > Add Control
- Select your custom control and configure visibility
Notes
- If the original control was never packaged, check the old environment’s custom solution layers or plugin registration for clues.
- Consider submitting the rebuilt control to the PCF Gallery for future reuse and community visibility.
