The 'Power Platform VS Code Extension' now includes a version of the CLI (command line interface) with a version of the pac command that includes canvas app support.
What this means is that we can now unpack and pack canvas app source code, simply by installing Visual Studio Code and adding the 'Power Platform VS Code Extension'. Unlike before, there's no need to install additional pre-requesite components.
The extra benefit is that the 'Power Platform VS Code Extension' also adds intellisense support, to simplify the whole process of building canvas apps with code.
Let's now look at this feature in a bit more detail.
Setting up a machine to unpack/pack source code
To setup a machine to unpack/pack source code, we download and install Visual Studio Code from the following link:
On a Windows machine, the downloaded file is 76MB, and the installation requires just under 200MB disk space.
Once Visual Studio Code is installed, we click the extensions icon from the left hand pane (the icon with 4 rectangles), and search for the 'Power Platform VS Code Extension'. As the screenshot beneath shows, the installation of the extension adds pac CLI 1.6.7 (the version that first includes the version of pac with canvas app support).
How to unpack an MSAPP file
To unpack an msapp file, we run start a new terminal window by clicking the Terminal > New terminal menu item, and running the following command:
pac canvas unpack --msapp C:\PowerApps\MSAppFiles\IssueAppSQL.msapp
The command above unpacks the msapp file from the following source location, to the target destination folder
- Source msapp file: C:\PowerApps\MSAppFiles\IssueAppSQL.msapp
- Target output folder: C:\PowerApps\ProjectFiles\IssueAppSQL
Editing the source with the VS Code extension
We can now edit our source code in the same Visual Studio code window by typing the following command:
code -r C:\PowerApps\ProjectFiles\IssueAppSQL
As the screenshot beneath shows, the extension shows intellisense suggestions for control attributes. At the moment, it doesn't provide code suggestions for formulas (eg, function name suggestions and code completion for the values of an OnSelect property).
Packing the an MSAPP file
The command to pack our code project into an output file called IssueAppSQLNew.msapp looks like this:
pac canvas pack --sources C:\PowerApps\ProjectFiles\IssueAppSQL
The "Power Platform VS Code Extension" for Visual Studio Code now makes it easier to build canvas apps from code. It adds basic intellisense and code completion for canvas apps objects, and it includes an updated version of the CLI that we can use to pack/unpack msapp files by calling the pac command.