Skip to main content

Commands used during PCF Control development

Common commands used

These are some common commands list which are used while developing a code component or PCF control.

Creating a new component project

Use this command to create new code component project.

For Standard Control

pac pcf init --namespace <specify your namespace here> --name <name of the code component> --template <component type> --run-npm-install

For React Based Control

pac pcf init --namespace <specify your namespace here> --name <name of the code component> --template <component type> --framework react --run-npm-install

Build your component

Use this command to build your code component project.
npm run build
npm run build --buildMode production

Debugging using the browser test harness

Use npm start or npm start watch to build the code component and open the local test harness in a new browser window. Watch mode enables you to quickly see the changes in action.
npm start
npm start watch
Ctrl + C to stop the debugging

Package a code component

Use this command to generate D365 CRM solution zip file, which can be imported into Dataverse.
pac solution init --publisher-name <name of the publisher> --publisher-prefix <prefix to be used>
pac solution add-reference --path <path of the pcf control root folder>
msbuild /t:build /restore
msbuild
msbuild /p:configuration=Release

Connecting to your environment

Use these commands to connect to Dataverse and deploy code component to Dataverse directly from Visual Studio Code.
pac auth create --url https://xyz.crm.dynamics.com
pac auth list
pac auth select --index <index of the active profile>
pac pcf push --publisher-prefix <your publisher prefix>

Comments

Popular posts from this blog

Getting Started with PCF Control Development: A Beginner's Guide

Before delving into development, it's crucial to grasp the concept of PCF controls. PCF controls are reusable components that can be seamlessly integrated into Power Apps and Dynamics 365 to enhance user experience and extend functionality beyond the out-of-the-box offerings. These controls are built using web technologies such as HTML, CSS, and TypeScript, offering developers the flexibility to tailor solutions to specific business needs. Power Apps Component Framework (PCF) is a Microsoft framework for building custom components in Power Apps. This blog post will guide you through the process of setting up your development environment and creating your first PCF control. Prerequisites Before we start, make sure you have the following installed on your machine: Node.js (version 10.x or later) Any one of below- Visual Studio Code or Visual Studio 2017 or later with .NET Framework 4.6.2 Developer Pack Power Apps CLI You can download Node.js from the official Node.js website, .NET Fr

Time Window Picker Control

In addition to date selection, the control also facilitates the selection of the start time and end time. This control can be used in the scenario where a time range selection is required along with date selection. For example to input appointment/meeting time or arrival window, it requires to select date and start time and end time. This is achieved through two Dropdown components, each populated with time slots (slots are configurable, default is 30 min) in a 24-hour format (configurable, it can be 12-hour format also). Users can select the desired start and end times from these dropdowns. Control Demo Steps to Use the Control Import the control solution zip file into target environment. Solution file can be downloaded from this link: Control Solution File . Configure the control on the form using a date time field. Provide following properties values for the control. Here, I have used arrivalwindowstarttime field to add the pcf control on the form.  Next step will be to apply the J