Power Community

Power Community

PCF Create, Build, Deploy Cheat Sheet

The following are steps to create, build, and deploy PCF controls. You will need to install the Power Platform CLI and have msbuild (from Visual Studio). Aliases are used where possible.

Usage: pac pcf init [--namespace] [--name] [--template] [--framework] [--outputDirectory] [--run-npm-install]
  --namespace                 The namespace for the component. (alias: -ns)
  --name                      The name for the component. (alias: -n)
  --template                  Choose a template for the component. (alias: -t)
                              Values: field, dataset
  --framework                 The rendering framework for control. The default value is 'none', which means HTML. (alias: -fw)
                              Values: none, react
  --outputDirectory           Output directory (alias: -o)
  --run-npm-install           Auto run 'npm install' after the control is created. The default value is 'false'. (alias: -npm)

How to initialize a project.

Field Templates

The following are field type templates.

Standard Field

Create Field (Standard template, non-React) without npm install (you would as an additional manual step):

pac pcf init -n  -ns  -t field

is used in the class in index.ts and in the constructor, display-name-key and description-key in the ControlManifest.input.xml.
is used in the ControlManifest.input.xml.

Create Field (Standard template, non-React) with npm install:

pac pcf init -n  -ns  -t field -npm

React (Virtual) Field

Create Field (React template) with npm install:

pac pcf init -n  -ns  -t field -fw react -npm

Dataset Templates

The following are dataset templates.

Standard Dataset

Create Dataset (Standard template, non-React) with npm install:

pac pcf init -n  -ns  -t dataset -npm

React (Virtual) Dataset

Create Dataset (React) with npm install:

pac pcf init -n  -ns  -t dataset -fw react -npm

Build with npm:

npm run build

Test harness and debug with npm:

npm start watch

Increment the version in the ControlManifest.input.xml file if you are deploying via a solution.

Create a subdirectory called Solution, then go to that directory to run this command:

pac solution init --publisher-name developer --publisher-prefix dev

This creates a src subfolder in the solution directory and a Solution.cdsproj file. The srcOther directory has the files Customizations.xml, Relationships.xml, Solution.xml.

The publisher name is the name of the publisher that will be created (or used) by this command. The prefix provided will be used on the publisher and the control, e.g. if prefix is carlprefix_ then the control will be carlprefix_carlcontrolnamespace.carl_controlname.

Add reference to base (non-Solution) folder:

pac solution add-reference --path 

This adds a “ProjectReference” back to ..PCFBuildTest.pcfproj in the Solution.cdsproj file.

Run this also from Solution folder using the Visual Studio Developer command prompt:

msbuild /t:build /restore

This creates an unmanaged solution.zip file in the SolutionbinDebug directory.

msbuild /p:configuration=release

This creates a managed solution (and smaller build) in the Solutionbinrelease directory.

If you have not created an authorization profile:

pac auth create -u 

If  you already have an authorization profile you can use below to view the list:

pac auth list

And below to select which org to deploy to:

pac auth select -i 

If pushing directly to an environment (without using a solution), run this from the base control directory (not Solution subfolder):

pac pcf push --publisher-prefix 

If deploying a solution, be sure to increment the version in the ControlManifest.Input.xml file.

Note the folder structure created above:

– Folder you created manually, e.g. C:PCFMyControl. This will contain config files such as package.json, package-lock.json, pcfconfig.json, tsconfig.json, .eslintrc.json. The .pcfproj file takes the name from this folder, e.g. MyControl.pcfproj
— Folder for Control Name specified above, e.g. if name is MyPCFControl, folder is called MyPCFControl. This can be a different name from the root folder above.

— node_modules, created as a result of npm install

— Solution, the directory you create to hold the solution. This gets populated when you run the solution commands, but that does not generate the solution.zip file.

— SolutionbinDebug holds the unmanaged solution.zip file.

— Solutionbinrelease holds the managed solution.zip file.

Error: Cannot find module ‘ajv/dist/compile/codegen’

npm install --save-dev ajv
THANKS FOR READING. BEFORE YOU LEAVE, I NEED YOUR HELP.

 

I AM SPENDING MORE TIME THESE DAYS CREATING YOUTUBE VIDEOS TO HELP PEOPLE LEARN THE MICROSOFT POWER PLATFORM.

IF YOU WOULD LIKE TO SEE HOW I BUILD APPS, OR FIND SOMETHING USEFUL READING MY BLOG, I WOULD REALLY APPRECIATE YOU SUBSCRIBING TO MY YOUTUBE CHANNEL.

THANK YOU, AND LET’S KEEP LEARNING TOGETHER.

CARL

https://www.youtube.com/carldesouza

ABOUT CARL DE SOUZA
image

This post was originally published on this site

- Advertisement -spot_img

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisement - Advertisement

Latest News

5 Benefits of In-App Notifications for Microsoft Dynamics 365 CRM users

For a successful sales process, you need to stay up-to-date with crucial sales information like deal closures, opportunities won,...

More Articles Like This

- Advertisement -spot_img