In my previous post I subtly introduced a few PACX commands created to streamline WebResource development lifecycle.

Let's deep dive on those to understand what they do and why I created them, starting from the beginning.

🪄 pacx webresources init

Also known as pacx wr init, it can be used to set-up the local folder where we save the WebResources we are creating.

👨🏻‍💻 Set-up the local folder? What do you mean? It's not enough to create a simple folder and put everything there?

In Dataverse there's no common rule on how to name WebResources. The only constraint is all WebResources unique names must start with the prefix of the publisher of the hosting solution, followed by underscore (_).

It is common though to see something like this (even from Microsoft itself):

You are not forced to specify an extension, neither you're forced to organize things in a way that are easily searchable to the ones that need to manage them. Frankly, I don't like it.

I prefer to organize things to make them easily discoverable. One way (that's also the way used by my all-time-favourite XrmToolbox tool, WebResources Manager) is to organize them in "folders".

After the publisher prefix part, you can use backslashes (/) to simulate a virtual path. You can choose your own preferred folder pattern... In any CE/Model Driven App project you have at least 3 sets of WebResources:

• images: such as entity icons, or command bar button icons
• scripts: JS files attached to Forms or Ribbons (command bars)
• pages: custom html WebResources like the one created in my previous posts.

I like to have a separate folder for each one of those sets, under a common root folder called like the "publisher prefix + _".
Then, the pages folder will have one or more subfolder, for each custom html WebResource I'm creating, and in that subfolder I will save the compiled html/js/css generated by the react build commands.

I also like to enforce the display name equal to the unique name (unless for some special case I will discuss later), and the presence of the file extension to improve readability.

Something like this:

Moreover, I want that folder pattern to be reflected on the Git repository where my WebResources are stored. That's why I created pacx wr init command.

The command takes as input:

• the folder (--folder, or -f) that will be the root of all my WebResources (optional, if not specified the current folder is used)
• the solution (--solution, or -s) that will contain the WebResources once created (optional, if not specified, the default solution for the current environment is used)

And creates, under that folder, the following structure:

Where:

• 📄 The .wr.pacx file is a marker file, is used by other commands to identify the root folder of our WebResources
• 📂 The ava_ folder is the folder that matches the name of the publisher extracted from the solution
  • 📂 The images folder is the folder where all images used by tables or commands will be stored
  • 📂 The pages folder is the folder that will contain all my custom html web resources
  • 📂 The scripts folder is the folder where all forms or ribbon (command bar) js files will be stored

That's it. Easy peasy, we have a way to quickly setup our WebResources folder.

👨🏻‍💻 Nice, ok. But I already have my Model Driven App in place, and a few WebResources there in a solution that are not versioned at all. Is there something I can do?

Sure! The command can also accept an additional argument, --remote (or -r): when specified, instead of creating the folders as specified above, the command will extract and download locally all the WebResources that were previously added to the solution, creating a folder structure that matches the names of the WebResources, as described above. That's it, quite easy!

🏃🏻 What's next?

In the next post of this series we'll see how to create JS WebResources and how to push them to Dataverse with minimum effort.

Stay tuned!