Grafana的前端插件有其独特的依赖关系，以及在运行时与Grafana应用程序共享的依赖关系。本文档重点介绍了这些共享依赖关系，特别是@grafana npm包的用法。
重要的是要明白，尽管插件在其package.json文件中指定了这些依赖项的预期版本，但它们在运行时与Grafana版本动态链接。
动态依赖链接
插件的package.json文件可以引用@grafana npm包的特定版本，例如@grafana/ui：9.5.1。在开发环境（如开发人员IDE或运行单元测试时）将使用此版本的@grafana/ui。
但是，当插件安装在Grafana实例中并执行时，它将继承Grafana应用程序正在使用的@grafana包的版本。例如，如果Grafana的版本是10.0.0，则插件将使用Grafana应用程序中共享的@grafana依赖项的10.0.0版本。
INFO 此动态依赖链接也适用于create-plugin提供的Docker开发环境。当插件在Grafana中运行时，它将继承Grafana应用程序中的@grafana依赖项的版本。
依赖共享机制 为了实现这种动态依赖链接，Grafana使用SystemJS来加载前端插件代码，并与插件共享一些Grafana应用程序的npm依赖项。
Grafana决定共享依赖项的原因有两个：
- 单例依赖项要求：在某些情况下，运行时只能存在一个依赖项实例。
- 性能优化：共享依赖项可以增强性能，尤其是在处理大型依赖代码库时。
共享依赖项的要求
为了共享依赖项，Grafana定义了两个关键组件：
- Grafana中的SystemJS导入映射： 依赖项必须列在Grafana应用程序的SystemJS导入映射中。
- 插件构建工具配置： 依赖项必须在插件的构建工具配置中外部化，这主要使用Webpack完成。
危险 不支持自定义构建工具配置以更改外部依赖项，这可能会导致插件加载失败或错误。
编译和运行时
当Grafana应用程序在前端加载时，SystemJS会注册在导入映射中找到的所有共享依赖项。当编译前端插件代码时，Grafana确保外部化依赖项存在于插件的运行时环境范围内。
当用户导航到需要特定插件的Grafana页面时，会发生以下步骤：
- SystemJS懒惰地加载插件的
module.js文件。 - SystemJS在
module.js文件中实例化代码，确保在执行代码之前将任何共享依赖项与插件中的外部依赖项引用链接起来。
此过程使Grafana能够高效地管理和共享各种插件的依赖项，同时确保在运行时使用正确和兼容的共享依赖项版本。
