Skip to content
9 changes: 9 additions & 0 deletions apps/spfx-cli/src/cli/actions/CreateAction.ts
Original file line number Diff line number Diff line change
Expand Up @@ -269,6 +269,15 @@ export class CreateAction extends SPFxActionBase {
throw error;
}
}

protected override getExamples(): string[] {
return [
'Scaffold a new React web part in the current working directory:\n spfx create --template webpart-react --component-name "HelloWorld" --library-name "helloworld-library" --solution-name "helloworld" --component-description "A Hello World web part"',
'Scaffold an extension with pnpm (skipping npm install):\n spfx create --template extension-field --component-name "ColorField" --package-manager pnpm',
'Scaffold a web part without npm install, specifying a local template source:\n spfx create --template webpart-react --component-name "MyWebPart" --library-name "mywebpart" --solution-name "mywebpart" --local-source ./my-templates',
'Scaffold a web part using a specific SPFx version:\n spfx create --template webpart-react --component-name "MyWP" --component-description "Description" --spfx-version 1.22'
];
Comment on lines +274 to +279

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
return [
'Scaffold a new React web part in the current working directory:\n spfx create --template webpart-react --component-name "HelloWorld" --library-name "helloworld-library" --solution-name "helloworld" --component-description "A Hello World web part"',
'Scaffold an extension with pnpm (skipping npm install):\n spfx create --template extension-field --component-name "ColorField" --package-manager pnpm',
'Scaffold a web part without npm install, specifying a local template source:\n spfx create --template webpart-react --component-name "MyWebPart" --library-name "mywebpart" --solution-name "mywebpart" --local-source ./my-templates',
'Scaffold a web part using a specific SPFx version:\n spfx create --template webpart-react --component-name "MyWP" --component-description "Description" --spfx-version 1.22'
];
const templateParameterName: string = this._solutionNameParameter.longName;
const solutionNameParmeterName: string = this._solutionNameParameter.longName;
const componentDescriptionParameterName: string = this._componentDescriptionParameter.longName;
const componentNameParameterName: string = this._componentNameParameter.longName;
const libraryNameParameterName: string this._libraryNameParameter.longName;
const packageManagerParameterName: string = this._packageManagerParameter.longName;
const spfxVersionParameterName: string = this._spfxVersionParameter.longName;
const localSourceParameterName: string = this._localSourceParameter.longName;
return [
`Scaffold a new React web part in the current working directory:\n spfx create ${templateParameterName} webpart-react ${componentNameParameterName} "HelloWorld" ${libraryNameParameterName} "helloworld-library" ${solutionNameParmeterName} "helloworld" ${componentDescriptionParameterName} "A Hello World web part"`,
`Scaffold an extension with pnpm (skipping npm install):\n spfx create ${templateParameterName} extension-field ${componentNameParameterName} "ColorField" ${packageManagerParameterName} pnpm`,
`Scaffold a web part without npm install, specifying a local template source:\n spfx create ${templateParameterName} webpart-react ${componentNameParameterName} "MyWebPart" ${libraryNameParameterName} "mywebpart" ${solutionNameParmeterName} "mywebpart" ${localSourceParameterName} ./my-templates`,
`Scaffold a web part using a specific SPFx version:\n spfx create ${templateParameterName} webpart-react ${componentNameParameterName} "MyWP" ${componentDescriptionParameterName} "Description" ${spfxVersionParameterName} 1.22`
];

}
Comment on lines +274 to +280
Comment on lines +273 to +280
}

/**
Expand Down
33 changes: 33 additions & 0 deletions apps/spfx-cli/src/cli/actions/SPFxActionBase.ts
Original file line number Diff line number Diff line change
Expand Up @@ -166,4 +166,37 @@ export abstract class SPFxActionBase extends CommandLineAction {
}
}
}

/**
* Returns usage examples for this action. Each string is a self-contained example
* with the command invocation and a brief description of what it does.
* Override in subclasses to provide examples. The default returns an empty array.
*/
protected getExamples(): string[] {
return [];
}
Comment on lines +175 to +177

/**
* Overrides the base help text rendering to append a formatted EXAMPLES section
* when examples are defined.
*/
public override renderHelpText(): string {
const base: string = super.renderHelpText();
const examples: string[] = this.getExamples();
if (examples.length === 0) {
return base;
Comment on lines +183 to +187
}
Comment on lines +183 to +188

// Append examples after the last line of base help
// Normalize Windows CRLF to LF before splitting so every line is clean
const lines: string[] = base.replace(/\r\n/g, '\n').split('\n');

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why bother splitting this? Just append \nEXAMPLES\n${exampleLines}\n to the base text.

lines.push('');
lines.push('EXAMPLES');
for (const example of examples) {
lines.push('');
lines.push(` ${example}`);
}
Comment on lines +195 to +198
Comment on lines +195 to +198
lines.push('');
return lines.join('\n');
Comment on lines +190 to +200
Comment on lines +190 to +200
}
Comment on lines +183 to +201
}