Here are some steps to follow to get a PowerApps Component Framework (PCF) boilerplate project setup locally on your PC.
I usually follow the same project structure for each PCF project I am working on which looks like below - assuming there is just a single PCF control being developed:
The 📁project folder contains the assets used to build the PCF control and the 📁solution folder contains the assets required to build and package a solution ZIP file for import into a CDS environment.
From within the 📁project folder, open PowerShell and run the below PowerApps CLI command:
pac pcf init --namespace RyanSpain.NET --name HelloWorldControl --template field
This command creates the PCF project and required assets. The 📁project folder structure should now look similar to the below:
Note the 📄project.pcfproj is named after the folder in which the command is run. This is why I have the folder structure I do 😊
Run this command in the 📁project folder to download the packages required to build the project.
The downloaded packages are located in 📁project/node_modules.
While there is no functionality yet, you can use the below commands to build and test the project as-is.
npm run build
The bundled output of the build can be found in 📁project/out. This path is configured in the 📄pcfconfig.json file.
npm run start
This command will build the project and run it using the PowerApps Component Test Framework harness in your browser.
From within the 📁solution folder, open PowerShell and run the below PowerApps CLI command:
pac solution init --publisher-name RSNET --publisher-prefix rsnet
This command creates the CDS solution project and required assets. The 📁solution folder structure should now look similar to the below:
Again, the 📄solution.cdsproj is named after the folder in which the command is run.
We need to reference any PCF project(s) we want to be included in the CDS solution file we will generate. To do this, run the below command in the 📁solution folder.
pac solution add-reference --path ../project
--path argument requires the folder in with the
pcfproj file is located.
To generate a CDS solution that can be imported, we need to run
msbuild in the 📁solution folder.
The initial build command should like the below which gathers the required packages.
msbuild /t:build /restore
Subsequent build can be done using this command.
Once you run one of the
msbuild commands, you should find an unmanaged solution file in 📁solution/bin/Debug.
- Configuring the control manifest
- Implementing logic and styles
- Building as a managed solution
- Deploying to a CDS environment
- Configuring in a model-driven app