Define the TypeScript version you want to use in SharePoint Framework

March 16, 2019

Since the release of SharePoint Framework 1.8.0, you will gain control over which TypeScript version to run in the build process.

Until the release of 1.8.0 version, we were always tight to TypeScript version 2.4.2. There was no way to change this, as it was part of the internal SPFx build engine, but this has changed. 

In SPFx 1.8.0, you can now use the TypeScript version you like to use in your project by installing the @microsoft/rush-stack-compiler dependency. This dependency has TypeScript version specific versions like @microsoft/rush-stack-compiler-3.3. So, when choosing your TypeScript version, you will need to install the matching rush stack compiler dependency.

Installing and configuring the compiler

When you start in a new project, it is best to skip the dependency installation by running yo @microsoft/sharepoint --skip-install. In existing projects, it is best to remove the node_modules folder. This gives you a clean project in which you can do the necessary configuration before installing the dependencies and won’t give you any dependency leftovers.

For this sample we use version 3.3 of TypeScript. Open your project in your preferred editor and remove the @microsoft/rush-stack-compiler-2.7 devDependency from your package.jsonfile.

Once you removed the dependency, run the following command: npm i @microsoft/rush-stack-compiler-3.3 -D -E. This makes sure it installs the latest version together with the installation of all the required SPFx dependencies.

Once all the dependencies are installed. You need to update the extends property in the tsconfig.json of your project. This property references to the 2.7 compiler version. You will have to update this to version 3.3.

Once you have done this, you are good to go. You can see if it worked by running a gulp build / bundle / ... task in your project.

SPFx build engine running with TS version 3.3
SPFx build engine running with TS version 3.3

Info: Marc D Anderson has written an article about his experience of updating a SPFx project to TypeScript 3.3. Read more about it here: Common issues in SPFx 1.8.0 with TypeScript 3.3.