diff --git a/README.md b/README.md index d55837ed8..356241be1 100644 --- a/README.md +++ b/README.md @@ -561,6 +561,8 @@ This version comes with the bare minimum amount of features and functionalities | [React](https://github.com/microsoft/applicationinsights-react-js) | [![npm version](https://badge.fury.io/js/%40microsoft%2Fapplicationinsights-react-js.svg)](https://www.npmjs.com/package/@microsoft/applicationinsights-react-js) | [React Native](https://github.com/microsoft/applicationinsights-react-native) | [![npm version](https://badge.fury.io/js/%40microsoft%2Fapplicationinsights-react-native.svg)](https://www.npmjs.com/package/@microsoft/applicationinsights-react-native) +Click here for a [Type Error Fixed Guideline](https://microsoft.github.io/ApplicationInsights-JS/ExtensionErrorSteps) + ## Build a new extension for the SDK The SDK supports the ability to include multiple extensions at runtime. In order to create a new extension, please implement the following interface: diff --git a/docs/ExtensionErrorSteps.md b/docs/ExtensionErrorSteps.md new file mode 100644 index 000000000..2d822c021 --- /dev/null +++ b/docs/ExtensionErrorSteps.md @@ -0,0 +1,38 @@ +# Investigating and Solving Plugin-Type Errors in Extensions + +This guide addresses plugin-type errors encountered when using the `applicationinsights-web` package alongside other extensions, such as `@microsoft/applicationinsights-react-js`, `@microsoft/applicationinsights-react-native`, and `@microsoft/applicationinsights-angularplugin-js`. + +## Overview + +A common error message associated with these issues might look like this: + +```plaintext +Type 'ReactPlugin' is not assignable to type 'ITelemetryPlugin'. +``` + +Plugin-type errors often arise due to version mismatches between applicationinsights-web and its extensions. + +## Reason + +When a new version of applicationinsights-web (which includes applicationinsights-core as a dependency) is released, package management tools may automatically update applicationinsights-core to the new version. However, if the extensions (e.g., React, Angular) have not been updated, their dependencies on applicationinsights-core may not match, leading to type errors. + +## Steps to Investigate and Solve Plugin-Type Errors + +### 1. Verify Package Versions + +- **Check Dependencies**: Ensure that you have compatible versions of applicationinsights-common, applicationinsights-core, and any other related libraries. Look for discrepancies in your yarn.lock or package-lock.json or node_modules folder. +![alt text](./media/pluginType.png) + +### 2. Perform a Complete Update +The easiest way to ensure all dependencies are updated is to delete the node_modules folder and reinstall the packages: +``` +rm -rf node_modules +npm install +``` +### 3. Examples to follow +Here is a discussion that provide deeper insights into resolving these issues: +https://github.com/microsoft/applicationinsights-react-js/issues/95 + + + + diff --git a/docs/media/pluginType.png b/docs/media/pluginType.png new file mode 100644 index 000000000..9fe4ea4f8 Binary files /dev/null and b/docs/media/pluginType.png differ