The module allows arranging live reload capability on SharePoint host pages on frontend assets changing and publishing.
npm install sp-live-reload --save-dev
const gulp = ;const spsave = ;const watch = ;const through = ;const LiveReload = ;let config = ;gulp;
const gulp = ;const spsync = ;const watch = ;const through = ;const LiveReload = ;let config = ;gulp;
gulp-spsynchas different idiology for the paths. In case of it
spFolderin settings always should be equal to "".
siteUrl - SharePoint site (SPWeb) url [string, required]
watchBase - base path from which files in a local project are mapped to remote location [string, required]
spFolder - root folder relative (to
siteUrl) path in SharePoint mapped to a project [string, required]
creds - node-sp-auth creds options for SPSave and custom monitoring action provisioning [object, optional for
protocol - protocol name with possible values:
https [string, optional]
host - host name or ip, where the live reload server will be running [string, optional, default:
port - port number [string, optional, default:
ssl - ssl parameters [object, required only on case of
protocol equal to
key- local path to
cert- local path to
spSaveCreds are identical as the modules use the same core authentication module.
spSaveCoreOptions can be checked here.
For making initial dive in with the library easier Yeoman generator-sppp is recommended, it has
sp-live-reload integrated and creates a scaffolding project with all neccessary setup.
In case of publishing scripts to a CDN (to the different [from SharePoint] domain) raw path should be passed to
Second parameter equal
true, tells emitter to prevent the path value from any local transformation.
By default, the path is transformed from the local one (
D:\Projects\ProjectName\src\folder\you_file_path.ext) to a relative SharePoint path (
watchBase = ``D:\Projects\ProjectName\src
For https hosts like SharePoint online self-signed sertificate should be generated and added to trusted one.
1. Install openssl
brew install openssl
choco install opensslkey
apt-get install openssl
2. Generate keys
openssl genrsa -out key.pem
openssl req -new -key key.pem -out csr.pem
openssl x509 -req -days 9999 -in csr.pem -signkey key.pem -out cert.crtrm csr.pem
3. Add cert to trusted
Depending on your client OS, add
cert.crt to Trusted root certificates.
Live reload client script can be installed within SharePoint by referencing
By default, the path to the client is following:
The client also can be delivered to SharePoint as a site collection script source custom action by using gulp task:
To delete such a custom action another gulp task can be used:
Live reload feature during active development stage on DEV environment. The manual monitoring script encapsulation is recommended on a specific page while the process of coding and debugging.
There are cases then a page/view should be running on a specific device, let's say iPad and Safari. For sure, an emulator can be used. But sometimes only the real device can show a behavior. Live reload with shared monitoring server can provide instantaneous reloading feature on a device.