Epic Visio Skills produced this cool illustration of Microsoft Teams extensibility!

How to Teamsify an SPFx solution?

This post describes how you can modify your SPFx webparts to make them compatible with usage in Microsoft Teams. I’m also showing some basic ideas what you can do in the code to make the integration more useful! Why would we do this? Who wouldn’t want to just develop once and then run their code everywhere? Now with SPFx (SharePoint Framework) 1.8 being out (and 1.9 being out for a while before being pulled!), we’re getting one step closer to that, as we’re given an…Continue reading How to Teamsify an SPFx solution?

Microsoft Teams context in SharePoint Framework client-side code.

How to solve the error “Property ‘microsoftTeams’ does not exist on type ‘WebPartContext’.”

This article explains how to fix an issue where you’re just minding your own business, trying to access the Microsoft Teams context in your SPFx webpart’s WebPartContext via the built-in property microsoftTeams, but you run into an issue. Simple stuff, but it’s still easy to run into this one, so I think it’s worthwhile to document the solution somewhere. Problem Most likely, the line causing you issues looks something like this: this.context.microsoftTeams. Of like shown below in Visual Studio Code: This error will lead to…Continue reading How to solve the error “Property ‘microsoftTeams’ does not exist on type ‘WebPartContext’.”

"npm outdated" showing my @microsoft/sp- packages being badly outdated.

How to update your SPFx webpart to a new version of SharePoint Framework

Instead of being stuck on whatever version your SPFx project was originally created with, it’s possible and sometimes required to upgrade it afterwards to gain access to newer functionalities like integration with Microsoft Teams. This process, to me, is comparable to updating the .NET Framework version in your classic web application projects – while it’s sometimes a matter of simple configuration change and a rebuild, most of the time there’s a bunch of steps included and not all of them might be obvious or anywhere…Continue reading How to update your SPFx webpart to a new version of SharePoint Framework

Encountering AADSTS700054 in the wild. Always a bother - but let me tell you how to fix it!

How to fix “AADSTS700054: response_type ‘id_token’ is not enabled for the application” error

This article will explain to you how to fix the error “AADSTS700054” Another day, another unsuccessful authentication attempt, and another cool error code. This one I encountered when building a little POC that was supposed to authenticate against Graph API. Problem When developing your client-side solution (an SPFx webpart, React app, ASP.NET MVC application with some client-side components… Your pick!), you run into this error when your code tries to authenticate against Azure AD: AADSTS700054: response_type ‘id_token’ is not enabled for the application. And nothing…Continue reading How to fix “AADSTS700054: response_type ‘id_token’ is not enabled for the application” error

[SPLoaderError.loadComponentError]: ***Failed to load component "9951b316-c8f2-4e27-887a-b7a46b3e94a0" (ContosoSPFxWebPart). Original error: ***Failed to load path dependency "ContosoSPFxWebPartLocalization" from component "9951b316-c8f2-4e27-887a-b7a46b3e94a0" (ContosoSPFxWebPart). Original error: Error loading https://component-id.invalid/9951b316-c8f2-4e27-887a-b7a46b3e94a0_1.3.1/ContosoSPFxWebPartLocalization Unable to load script https://contoso.sharepoint.com/sites/contosoapps/ClientSideAssets/490f3be2-7e8a-4fe5-8d6b-49ae5d7c4a2e/s-ContosoSPFxWebPartLocalization_en-us_2b301efaa958eadafbad865f710d89e4.js ***INNERERROR: ***Failed to load path dependency "ContosoSPFxWebPartLocalization" from component "9951b316-c8f2-4e27-887a-b7a46b3e94a0" (ContosoSPFxWebPart). Original error: Error loading https://component-id.invalid/9951b316-c8f2-4e27-887a-b7a46b3e94a0_1.3.1/ContosoSPFxWebPartLocalization Unable to load script https://contoso.sharepoint.com/sites/contosoapps/ClientSideAssets/490f3be2-7e8a-4fe5-8d6b-49ae5d7c4a2e/s-ContosoSPFxWebPartLocalization_en-us_2b301efaa958eadafbad865f710d89e4.js ***CALLSTACK: Error at t [as constructor] (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:889:16049) at new t (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:21125) at Function.e.buildErrorWithVerboseLog (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:16214) at Function.e.buildLoadComponentError (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:12245) at https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:60385

SPFx webpart fails with “Failed to load component – – There was a network error.”

SPFx development is a bottomless bag of funsies! This article describes yet another way how to fix the error with your SPFx webpart failing to load a module. In this case, you’ll get an error that starts with the generic “Failed to load component” -part, but contains “There was a network error” later in the stack. I’ve written about this before, but I keep running into new ways to mess up, so I’ll keep documenting the solutions as well! Problem So, this one left me…Continue reading SPFx webpart fails with “Failed to load component – – There was a network error.”

Epic Visio Skills produced this cool illustration of Microsoft Teams extensibility!

Extending Microsoft Teams is now officially awesome

This article is something of a combination of a technology overview and an opinion piece, detailing my thoughts about extending Microsoft Teams. To me, extending Microsoft Teams has pretty much only now become relevant. Before, the palette was still quite unfinished, but now we’re definitely getting to a point where there are meaningful and cost-effective extension scenarios to cover most of the relevant use cases for most organizations. Don’t take this for an inflammatory or disrespectful post – I’m writing this from my personal point…Continue reading Extending Microsoft Teams is now officially awesome

Microsoft Teams extensibility

How to resolve “Error initializing application. Error: ***Manifest not found for component id [guid].” when adding an SPFx webpart to Teams?

This article describes one way to fix the issue, where uploading and sideloading an SPFx webpart in Microsoft Teams just brickwalls you with a fairly non-descriptive error, and no way to proceed. Luckily, this is usually simple to fix – I’ll describe 2 different solutions I’ve found so far! Problem You’ve got a SPFx webpart, that you’ve packaged as a Teams extension. You can even find it from Teams extensions, but while adding it as a tab, you run into issues. Oh. That’s a bummer.…Continue reading How to resolve “Error initializing application. Error: ***Manifest not found for component id [guid].” when adding an SPFx webpart to Teams?

[SPLoaderError.loadComponentError]: ***Failed to load component "9951b316-c8f2-4e27-887a-b7a46b3e94a0" (ContosoSPFxWebPart). Original error: ***Failed to load path dependency "ContosoSPFxWebPartLocalization" from component "9951b316-c8f2-4e27-887a-b7a46b3e94a0" (ContosoSPFxWebPart). Original error: Error loading https://component-id.invalid/9951b316-c8f2-4e27-887a-b7a46b3e94a0_1.3.1/ContosoSPFxWebPartLocalization Unable to load script https://contoso.sharepoint.com/sites/contosoapps/ClientSideAssets/490f3be2-7e8a-4fe5-8d6b-49ae5d7c4a2e/s-ContosoSPFxWebPartLocalization_en-us_2b301efaa958eadafbad865f710d89e4.js ***INNERERROR: ***Failed to load path dependency "ContosoSPFxWebPartLocalization" from component "9951b316-c8f2-4e27-887a-b7a46b3e94a0" (ContosoSPFxWebPart). Original error: Error loading https://component-id.invalid/9951b316-c8f2-4e27-887a-b7a46b3e94a0_1.3.1/ContosoSPFxWebPartLocalization Unable to load script https://contoso.sharepoint.com/sites/contosoapps/ClientSideAssets/490f3be2-7e8a-4fe5-8d6b-49ae5d7c4a2e/s-ContosoSPFxWebPartLocalization_en-us_2b301efaa958eadafbad865f710d89e4.js ***CALLSTACK: Error at t [as constructor] (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:889:16049) at new t (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:21125) at Function.e.buildErrorWithVerboseLog (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:16214) at Function.e.buildLoadComponentError (https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:12245) at https://spoprod-a.akamaihd.net/files/sp-client-prod_2019-03-15.008/sp-pages-assembly_en-us_2676c0dcef2e33d08d5b8433ef878499.js:1512:60385

SPFx | Failed to load component.

This post describes the typical reasons why might encounter the following error, and the ways I’ve found to fix them: “Failed to load component. Original error: ***Failed to load path dependency ContosoSPFxWebPartLocalization from component [guid] (ContosoSPFxWebPart)” The error typically looks something like in the screenshot below: Problem This error can be thrown for a lot of different reasons. I’m trying to describe the variants I’ve run into and their fixes below. But first, let’s take a closer look into the error in question! Posts Related…Continue reading SPFx | Failed to load component.