sp-dev-fx-webparts/samples/js-solution-editions
dependabot[bot] aafffdd143
Bump webpack-dev-middleware in /samples/js-solution-editions
Bumps [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) from 5.3.3 to 5.3.4.
- [Release notes](https://github.com/webpack/webpack-dev-middleware/releases)
- [Changelog](https://github.com/webpack/webpack-dev-middleware/blob/v5.3.4/CHANGELOG.md)
- [Commits](https://github.com/webpack/webpack-dev-middleware/compare/v5.3.3...v5.3.4)

---
updated-dependencies:
- dependency-name: webpack-dev-middleware
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>
2024-03-23 16:22:06 +00:00
..
.devcontainer added remaining containers 2022-02-16 21:47:07 -05:00
assets Changed docs links to learn 2022-10-24 09:42:45 -04:00
config
src/webparts/helloWorld
typings
.editorconfig
.gitattributes
.gitignore
.npmignore
.yo-rc.json
README.md Added more contributions 2023-03-15 01:23:34 -04:00
gulpfile.js
package-lock.json Bump webpack-dev-middleware in /samples/js-solution-editions 2024-03-23 16:22:06 +00:00
package.json bump the npm_and_yarn at /samples/js-solution-editions security update group 2023-10-25 23:02:47 +00:00
tsconfig.json
tslint.json

README.md

page_type products languages extensions
sample
office-sp
javascript
typescript
contentType technologies createdDate
samples
SharePoint Framework
9/1/2017 12:00:00 AM

Handling Multiple Editions of SPFx Solution

Summary

This sample shows a possible approach of handling multiple editions (e.g. trial, lite, full) of SharePoint Framework solution.

Compatibility

⚠️ Important
Every SPFx version is only compatible with specific version(s) of Node.js. In order to be able to build this sample, please ensure that the version of Node on your workstation matches one of the versions listed in this section. This sample will not work on a different version of Node.
Refer to https://aka.ms/spfx-matrix for more information on SPFx compatibility.

SPFx 1.1.0 Node.js v6 Compatible with SharePoint Online Compatible SharePoint 2019 Compatible with SharePoint 2016 (Feature Pack 2) Local Workbench Compatible Hosted Workbench Compatible Compatible with Remote Containers

Applies to

Contributors

Version history

Version Date Comments
1.0 August 23, 2017 Initial release

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.

Description

Use Case

You are an ISV and developing some product that has multiple editions, let's say, trial, lite, full. You want to have a separate package file (.sppkg) for each edition and also reference different CDNs based on the edition.

Problems to address

Thinking about the use case in details we can point several problems that should be addressed:

  • When we're creating a new version we should create 3 separate .sppkg files
  • Each .sppkg file should contain manifest that references different CDN endpoints
  • It should be easy to upgrade customer from trial to lite and then to full; or directly from trial to full
  • You should know current edition in the code to execute the logic based on the edition's restrictions

Approach

This sample shows the approach that is based on a custom Gulp task that should be run before bundling and packaging the solution. The name of the task is change-build-edition. Parameter: edition. The task updates SPFx solution configuration files to contain edition-specific information:

  • deploy-azure-storage.json is updated to contain correct container value
  • package-solution.json is updated to contain correct solution.version and paths.zippedPackage values. In this sample I'm using version's revision - 4th digit - to specify the edition: 0 for trial, 1 for lite, 2 for full. It allows to easily update customers. zippedPackage path is modified to create sppkg in subfolder based on edition configuration.
  • write-manifests.json is updated to contain the correct CDN endpoint URL.

Additionally, the web part's source code folder contains custom-config.json file with edition property:

{
    "edition": "full"
}

This file is modified by a custom task as well to contain the correct edition. Later custom-config.json is referenced (require('./custom-config.json')) in web part code to provide custom logic based on current edition.

Use the following commands to build specific edition version:

gulp change-build-edition --edition lite
gulp bundle --ship
gulp package-solution --ship
gulp deploy-azure-storage

Resources

Handling Multiple Editions of SPFx Solution