Alex Terentiev edited this page Sep 27, 2018 · 11 revisions

Welcome to the Yeoman generator for SharePoint Framework Property Pane Controls!

Adding New Property Pane Control to the Web Part Project

This is not a standalone generator and should be used for the SharePoint Framework projects that were previously scaffolded using SPFx generators: yo @microsoft/sharepoint

  • install the generator globally
npm i -g generator-spfx-proppane-control
  • scaffold new property pane control as many times as you like
yo spfx-proppane-control
  • follow the prompts from the generator

Adding the Control to the Property Pane

Add the control to the property pane using helper function from PropertyField<ComponentName>ts file:

import { PropertyFieldComponentName } from '../../propertyFields/<componentName>/PropertyField<ComponentName>';
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
PropertyField<ComponentName>(targetProperty, {...})

Available Frameworks Options


version description
0.9.0 Initial version No Framework and React Framework support
0.9.2 NPM package fix to include subgenerators folders
1.0.0 Vue.js support
1.1.0 1. Fix for Vue.js SFC with no code splitting
2. Support of Yarn and pnpm package managers
Clone this wiki locally
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.