SPClientSideDeployment 3.0 adds auto-deploy on save option and support for compilable JS and CSS

I have just released version 3.0 of SPClientSideDeployment with two major enhancements:

  • Auto-deploy on save: when this option is enabled, files will automatically be deployed to SharePoint each time you save them
  • Support for compilable JavaScript and CSS: the tool detects if the file is TypeScript, JSX, LESS or SASS, and if so deploys the compiled output to SharePoint

Download it now!

You can download the latest version of SPClientSideDeployment from the Visual Studio Gallery.

Auto-deploy on save

When this option is enabled, files configured for deployment in DeploymentSettings.xml will be automatically deployed to SharePoint each time they are saved.

To enable this option go to Tools \ Options \ SPClientSideDeployment and set Automatically Deploy on Save to true.

1 Option Menu

Note that this option does not report any error if the file you are saving is not defined in DeploymentSettings.xml. If a file is not being deployed on save as you had expected, then check if the file is correctly configured in DeploymentSettings.xml by explicitly triggering a deployment for the file (i.e. right-click then Deploy to SharePoint).

Support for compilable JavaScript and CSS

You can now specify TypeScript, JSX, LESS and SASS items in DeploymentSettings.xml for deployment. When the tool encounters one of these file types, it will look for and deploy the corresponding compiled output file instead of the actual source file.

For example, if the following was specified in DeploymentSettings.xml:

<File localPath="Scripts.ts">
		<Destination targetFolder="Style Library" />

then the tool will look for the file Scripts.js and deploy that to the Style Library. 

“Compilable” items are also supported when the Folder element is used in DeploymentSettings.xml. When processing files in the specified folder, the tool would look for and deploy the corresponding compiled outputs for any detected compilable items. Non-compilable items are processed as normal.

How compiled outputs are inferred

The tool always looks for the compiled output in the same physical location as the source file. The file name of the compiled output is inferred from the file name of the source file.

  • TypeScript source file: example.ts   –   compiled output: example.js
  • JSX source file: example.jsx   –   compiled output: example.js
  • LESS source file: example.less   –   compiled output: example.css
  • SASS source file: example.scss   –   compiled output: example.css

Automatic compilation of compilable JavaScript and CSS

The tool only looks for and deploys the compiled outputs of compilable items. It does not perform any compilation. The tool works best when automatic compilation of these items are enabled in Visual Studio.

For TypeScript, automatic compilation is supported in Visual Studio 2015. By default this is only available for ASP.NET Web Application projects. See this post for enabling it on other project types.

For JSX, LESS and SASS, you can use the Web Compiler extension to enable this.

SPClientSideDeployment’s option to automatically deploy on save works nicely with automatic compilation. If you have enabled this option, then the tool will monitor and automatically deploy the compiled outputs after the compilation has finished.

How compilable items are treated when publishing deployment package

SPClientSideDeployment has a feature that allows you to publish your project as a package for deployment. The package includes a PowerShell script that you can use to deploy the files to a target SharePoint instance. I encourage you to read more about this feature here if you are not already familiar with it.

Support for compilable items has also been added to this feature. When publishing a package, if a compilable item is detected, then only its compiled output would be included in the package. The generated PowerShell script would correctly deploy the compiled outputs to the target SharePoint instance.

Note that the PowerShell script has been updated to include this support. Therefore, if you are updating an existing project to take advantage of this feature, then you’d need to republish the package to regenerate the PowerShell script.

Support for minified version of compiled outputs

Currently there are no supports for minified version of the compiled outputs. This will be added in the next version.


This release aims to further streamline your dev-deploy-test-repeat process and enables you to extend this streamlined approach to compilable JavaScript and CSS. I hope you find the new features useful – and as always, would love to hear from you with feedback and suggestion.



About Bernado

Based in Australia, I am a freelance SharePoint and Dynamics CRM developer. I love developing innovative solutions that address business and everyday problems. Feel free to contact me if you think I can help you with your SharePoint or CRM implementation.
This entry was posted in SharePoint, SPClientSideDeployment. Bookmark the permalink.

2 Responses to SPClientSideDeployment 3.0 adds auto-deploy on save option and support for compilable JS and CSS

  1. Mark Gabriel says:

    Thanks for writing this tool, it is extremely useful. Although, it is currently unreleased as of this writing unless you compile it yourself, the new version of Web Compiler supports pre-compiling Handlebars templates. Would you also support the copying of the compiled js file after the Handlebars template is processed?

    Thanks again for your amazing plug-in!

    Bests Regards,

    Mark Gabriel

    • Bernado says:

      Thanks for the kind feedback Mark.

      I have to admit I’m not very familiar with Handlebars and how it works together with Web Compiler. I will need to have a look and see what’d be feasible. I will let you know.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s