[main][doc] add document for how to fix type error in extensions #2395
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -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. | ||
|  | ||
|
|
||
| ### 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 | ||
|
There was a problem hiding this comment. I think there is a new TypeScript flag (which most people wont use) -
There was a problem hiding this comment. Thanks. Will check that potential walk around before merge this pr. |
||
|
|
||
|
|
||
|
|
||
|
|
||
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It would be good to call out here that this is a TypeScript issue only as we work really hard to ensure that while the "types" (might) appear different to different versions of TypeScript at runtime the code should still interoperate as long as the "core" version is later than any sub-component as we support backward compatibility but not forward compatibility.
Which means we support older components working with "newer" dependencies (ie the newer dependency is backward compatible for older components) but not newer components working with "older" dependencies.
A good example of this is that we may from time to time "add" new public helper functions to core components that some "newer" extensions might use / need. As such that "newer" function is only available in the "newer" version of the core component and not in the older previous published components. (ie. we don't know now (or back then) what functions we "might" need in a future release -- why I call it forward compatibility)