Using SharePoint PnP PowerShell Modules Side-by-Side (2013, 2016, & Online)

Applies to SharePoint 2013, 2016, O365

Are you using SharePoint PnP PowerShell yet? Why not!?! Developers, IT Pros, and Power Users can all benefit from the SharePoint PnP PowerShell modules. The cmdlets wrap up a bunch of complex CSOM and REST calls into 280+ awesome commands. If you’re not using SharePoint PnP PowerShell you’re doing things on hard mode.

Installing SharePoint PnP PowerShell is super easy. You just choose your target version (2013, 2016, or Online) and install. If you’re on Windows 10 you can literally type Install-Module SharePointPnPPowerShellOnline into an administrator shell and you’re done.

But what if you’re like me and have multiple versions you need to target? I find myself needing to switch between SharePoint on premises and online all the time. Unfortunately the modules are often not cross-version compatible due to the different CSOM versions supported between the products. Something as simple as Get-PnPFolder against a 2013 site using the Online module won’t work and the errors aren’t always super obvious:

Error

For a while I’ve just used the Uninstall-Module command and just switched between them that way. This has struck me as dumb for a while now so I finally reached out to The Father himself, Erwin van Hunen, and he responded right away:

Tweet

Awesome! Here’s how to do that (with screenshots!):

Install All the Modules

Although you can install all the modules, you can only have 1 active within any given session. So if you want to switch modules (once you’ve already loaded one) you’ll need to close and reopen PowerShell.

Option 1 – SharePoint On-Premises as Default

If you install the modules using the PowerShell Gallery they will be installed into the default modules path. As a result, when you use a PnP PowerShell Command the first module will be auto loaded (but the other 2 won’t because of conflicts). This appears to be alphabetical. So if you installed all 3 then the default module will be 2013. If you want to use the Online module instead, you would simply run Import-Module SharePointPnPPowerShellOnline before running any PnP PowerShell Commands.

You can’t just run the simple install command for each module. You’ll end up with some version of this error on your second module:

ClobberError

You’ll need to use the -AllowClobber parameter:

Install

You can then check what versions you have installed using this command:

Get-Module SharePointPnPPowerShell* -ListAvailable | Select-Object Name,Version | Sort-Object Version -Descending

Now you can use any of the modules without having to uninstall/install first! By default you’ll be using 2013 (or 2016 if you skipped 2013) which may match your use case perfectly! You can always use the Import-Module command to target one of the other versions.

Option 2 – SharePoint Online as Default

To have the Online module be the one that is auto loaded when you use a PnP PowerShell Command but still have the option to load one of the on premises modules, you should only install the Online module through the PowerShell Gallery:

Install-OnlineOnly

You can then check what versions you have installed using this command to ensure you only have the Online module installed here:

Get-Module SharePointPnPPowerShell* -ListAvailable | Select-Object Name,Version | Sort-Object Version -Descending

To install the other module(s) you’ll use the Releases page to download the corresponding msi installers:

Releases

Just run these as normal to get these installed. Once the module(s) are installed, open System Properties from your control panel. Under the Advanced tab, click the Environment Variables… button. Under User variables, find the PSMODULEPATH variable. If the path(s) to the PnP PowerShell modules are the only values you can just delete it. Otherwise, you can edit it to remove those paths:

EnvironmentVariables

Now when you run a PnP PowerShell Command the Online module will be auto loaded (default). If you want to use one of the on premises modules instead, you have to run Import-Module PATHTOMODULE before running any PnP PowerShell Commands.

Unfortunately, the module path can be pretty long. For instance, here’s mine:

Import-Module C:\Users\ckent\AppData\Local\Apps\SharePointPnPPowerShell2013\Modules\SharePointPnPPowerShell2013

That’s not very convenient! Fortunately, the Windows PowerShell ISE provides snippets that can make it much simpler. You can create snippets using the New-IseSnippet command:

New-IseSnippet -Title " PnP2013" -Description "Imports the SharePointPnPPowerShell2013 Module" -Text "Import-Module $env:LOCALAPPDATA\Apps\SharePointPnPPowerShell2013\Modules\SharePointPnPPowerShell2013"

I put a space before the name so it would be at the top of the snippets. You can then access the snippet from either the script editor or the ISE prompt by pressing Ctrl-J:

Snippets

 

Now you can use the Online module by default but quickly load the on premises module as needed without having to uninstall/install all the time!

Thank you SPS St. Louis!

I had the honor of speaking at SharePoint Saturday St. Louis (in fact, I’m writing this from the speaker’s room). It was a great event!

JAZZ

My Sessions

I presented Getting the Most out of SharePoint Patterns and Practices (PnP). You can find the slides below.

Our goal was to introduce everyone to what’s in PnP (and to get them to use it), teach them how to stay up to date, and to encourage participation (even just documentation updates or submitting bugs).

There were some people that had never even heard of PnP and others that were using at least some portion. Everyone was really engaged and we had a lot of great discussion. I love showing off all the cool stuff in PnP and watching people be really amazed about the tools and resources they didn’t even know were available to them.

I also presented Understanding SharePoint Framework Extensions. These slides are also below.

Tons of excitement for SPFx Extensions, although it’s clear that the story of when and where to use these isn’t well known. There were lots of great questions and I even found a way to sneak in a demo of Column Formatter (whoops?).

SPS St. Louis was a really great event and the organizers should be very pleased with how well everything came together. Thanks to all the sponsors, organizers, speakers, and attendees! See you next year!

Resources

Join me at SharePoint Saturday St. Louis on January 20th!

I will be presenting Understanding SharePoint Framework Extensions AND Getting the Most out of SharePoint Patterns and Practices (PnP) on Saturday, January 20th, 2018 in St. Louis as part of SharePoint Saturday St. Louis!

city-of-st-louis-skyline-1.jpg

Mark Rackley and Stephanie Donahue will be presenting the keynote, Transforming Your Organization into a Digital Workspace and there are tons of other really great speakers!

At 9:10 i’ll be talking about SharePoint Patterns and Practices (PnP):

The SharePoint Patterns and Practices (PnP) is an open source initiative coordinated by SharePoint engineering – but what does that mean and why should you care? PnP has tons of tutorials, videos, samples, documentation, and tools (as in amazing, ground-breaking tools). If you haven’t heard of it or if you thought it was just one or two things, you’re doing SharePoint development on hard mode!

In this session we’ll dive into what’s available, how to get started, how to stay up to date, and even how to contribute. You’ll leave this session knowing not only what PnP is, but you’ll be ready to start taking advantage immediately! It doesn’t matter if your using On-Premises or Online, you’re sure to learn something new and likely amazing.

Then at 2:45, we’ll dive into the exciting world of SharePoint Framework Extensions:

SharePoint Framework Extensions are being touted as the replacement for Custom Actions, JS Link, and more – but what are they really? Whether you’ve started experimenting with the SharePoint Framework or not, come find out exactly what the Extensions are, when to use them, limitations, and advantages. SharePoint Framework Extensions are not only powerful and flexible tools to customize SharePoint, when it comes to modern pages, they’re the only way.

SPS St. Louis is sure to be a great event. If you’re even remotely in the area don’t miss out on this opportunity for free training and a chance to meet people who are also passionate about SharePoint and doing awesome stuff.

Column Formatting Client-Side Web Part: Column Formatter

Applies To: Office 365

Update

This solution is now officially a part of SharePoint PnP! Please use this repo for all updates, issues, contributions, and more. Whoo Whoo!


Modern listviews support the addition of custom formatting for most field types. This is an awesome feature designed to make custom formatting simpler and less administratively difficult than packaged solutions.

Unfortunately, the tooling is still very minimal. Users are given a simple text field within a panel to paste the JSON code and a preview and save button. The panel is clearly not designed to enable editing meaning that not only do users have to write code, they have to find someplace to do it.

The official suggestion is to use VS Code which will provide some auto completion using the standard schema. However, there are several downsides to this approach:

  • Requires a desktop client to be installed
    • Non developers that may have hung on past the initial mention of JSON are mostly gone by now
  • Once you do get VS Code up and running and begin editing your JSON:
    • The intellisense and syntax checking are very limited
    • There is no preview of your format
    • While some examples exist, there’s still a huge learning curve

I previously released a verbose schema which makes editing in VS Code a lot easier, but still doesn’t solve the preview problems, learning curve, or the need to use a tool outside of O365.

Column Formatter

ColumnFormattingChristmas4

Column Formatter is a SharePoint Framework client-side webpart I’ve created using React and Redux. It’s designed to give the full power of VS Code editing while providing easy to use templates and wizards all within the browser! The goal is to make writing and applying Column Formatting easier and quicker for both developers and end users.

Development Details

I originally set out to make an Application Customizer SPFx extension that would sit directly on the modern listview page. Unfortunately, there aren’t APIs available (at least that I could find) to load the CustomFormatter library on the page if none of the columns are using it yet, nor a way to trigger applying the formatting to the listview without actually changing the field’s CustomFormat value.

So I’ve extracted the CustomFormatter library into my project and am faking it by providing it only the dependencies it actually needs. While this gives me full control to enable “as you type” live preview of rendering, it also means that things could get out of sync with O365 development. For now, I’ll do my best to keep things updated but ultimately I’d like to be able to load the office CustomFormatter module on demand.

Similarly, I had to extract the styles of the modern listview and the unique classes for CustomFormatter.

The editor is a custom build of the Monaco Editor (the editor that powers VS Code). Getting this built as a module that worked in SPFx was a real challenge, but worth it because of the immense power it adds.

This was my first experience with Redux. It was hard to wrap my head around at first and there is a significant amount of boilerplate code required (largely to play nice with Typescript), but I wouldn’t do any React webpart of even minor complexity without it! It simplifies state management and makes additional iterations of features much easier.

What’s next

There are a few templates and wizards included currently, but there are way more that could be added. I plan to keep adding these and am open to both pull requests and suggestions.

DataBarsWizard
Wizards make it easy to generate Column Formatting without writing any code
TrendingTemplate
Templates provide you with starter code and sample data

I have submitted this webpart as an entry in the Hack Productivity 3 hackathon (Go vote for it, please!) which is why it’s currently hosted on my github. I’d like to get it included in SharePoint PnP if they’re open to it, although I’m not sure where it should go just yet.

More Information

You can find a lot more details about features and how to use Column Formatter in the ReadMe in the repo. I also created a demonstration video that covers a lot of the features:

Thank you SPS Detroit!

Over the weekend I had the honor of speaking at SharePoint Saturday Detroit. It was a well organized and well attended event. I had a great time and the feedback I got from attendees was extremely positive.

The event was held at Wayne State and the campus was covered in squirrels. Including totally black squirrels which I’d never seen (and assumed were rats at first) so of course I took a video:

Here’s a picture somebody else took:

A1FN14 / Black Squirrel
SQUIRREL!

SharePoint is cool and all, but those squirrels were great!

My Session

I presented Getting Started with the SharePoint Framework. You can find the slides below. Here was the outline:

  • Setup Steps 1 & 2
    • Installing NodeJS LTS
    • Installing VS Code
  • SharePoint Development: A Brief History
    • SP 2016 Development Recommendations
    • Office 365 Development Recommendations
  • The Modern Experience
  • Setup Step 3 & 4
    • Installing Yeoman & Gulp
    • Installing the SPFx Generator
  • An Introduction to the SharePoint Framework
    • Client-side Web Parts
    • SPFx Extensions
    • Tool Comparison
    • The SharePoint Workbench
  • Building Your First Client-Side WebPart
    • Running the Generator
    • Trusting the Dev Certificate
    • Exploring the Local Workbench
    • Adding a Custom Property
  • SharePoint Patterns & Practices
    • What’s in PnP (Selective Highlights
    • Staying Up to Date with PnP

If you have any questions about what I presented, or the SharePoint Framework in general, you can comment here or reach out on Twitter anytime. It was really tough to fit everything above into a 45 minute session so although it was a bit rushed, I think it went over pretty well and people seemed genuinely excited to get started with SPFx!

Resources

SPS Detroit was a great event. Thank you to all the sponsors, organizers, speakers, attendees, and squirrels!

Join us at SharePoint Saturday Detroit on December 2nd!

Matt Jimison and I will be presenting Getting Started with the SharePoint Framework (SPFx) on Saturday, December 2nd, 2017 in Detroit as part of SharePoint Saturday Detroit!

detroit-2560x1600

Our session is at 1:30 and will introduce you to the SharePoint Framework (both web parts and extensions). We’ll actually walk you through getting the various tools installed and ready (bring your laptop) so that by the time you leave you’ll know not only what the SharePoint Framework is, what it can do, and when to use it – you’ll be ready to start experimenting immediately!

A Verbose Schema for SharePoint Column Formatting (Proposal)

Declarative customization through Column Formatting in SharePoint Online is a really cool new way to customize how fields in lists and libraries are displayed. It’s all done through JSON and it’s pretty awesome.

I think there are a few minor areas it’s currently falling short, however. Such as:

Unfortunately, although there is an open source repo of great samples, Column Formatting itself is not something we can directly contribute to (outside of issues and user voice like the above). But, I had another issue that I really wanted solved so I solved it (at least for me) and thought I’d share and suggest it (or some version of it) should be adopted officially.

While a UI for generating the JSON would be awesome, the alternative suggestion of writing your column formatter in VS Code using the schema.json is a good one. However, I really wanted better intellisense to help me track down what I can and can’t do. So, I added a bunch of stuff to the schema.json file to do exactly that.

A Verbose Schema

Using my version of the columnFormattingSchema.json (currently available as a gist), you get fancy stuff like this:

VerboseColumnFormatting

Here’s what’s in here compared to the original:

  • Valid operations toLocalString(), toLocaleDateString(), and toLocaleTimeString() are no longer marked as invalid (added them to the operator enum)
  • The style property now only allows values corresponding to supported style attributes
    • Additionally, each style property has enum values corresponding to possible values
  • Valid attributes iconName, rel, and title are no longer marked as invalid
  • class attribute provides enum values (using the predefined classes)
  • target attribute provides enum values
  • role attribute provides enum values
  • rel attribute provides enum values
  • iconName attribute provides enum values
  • Most properties (like txtContent and operators) provide special string enums (@currentField, @me, @now, etc.)

It’s important to note that every value can still be an expression and even where enums are provided for convenience (like class or txtContent), you can still supply a string not in the list.

Using the Schema

When you apply column formatting the JSON is validated, but the actual schema isn’t really restricted like you might expect (this is why you could previously specify an iconName property without issue even though it was technically invalid). This also means that using the Verbose schema won’t cause any problems for you (I’ve actually tested it against every sample available to me) and is actually much more likely to prevent you from getting multiple console error messages about unsupported style attributes, etc.

For now, you can just save the file to your machine and use a local reference (as shown in the image above) or, even better, you can reference it directly from the gist (raw) like this:

{
    "$schema": "https://gist.githubusercontent.com/thechriskent/2e09be14a4b491cfae256220cfca6310/raw/eb9f675bf523208eb840c462d4f716fa92ce14c2/columnFormattingSchema.json"
}

Now, as long as you save that file with a .json extension, VS Code will automatically add the intellisense and extra validation!

You don’t even need to remove the $schema property (you can even leave it out, it is not currently used by SharePoint at all).

Also, for anyone that is wondering what the column formatter shown in the animation above looks like, here it is for a Person field:

Final
My name is red since I’m the logged in user