@ equinor/ 组合- 框架- dev- portal
在本地建立和测试Fusion框架应用程序的最小开发门户.
这是什么?
@equinor/fusion-framework-dev-portal 提供轻量级的门户外壳来映射出生产Fusion门户的布局——头,上下文选择器,书签侧页,人物设置,以及应用程序的路由——而无需全程的出厂管理. 是入口组件由 @equinor/fusion-framework-dev-server 财务报告和审定财务报表 @equinor/fusion-framework-cli 当本地运行应用程序时.
本地应用程序开发需要门户主机时使用此软件包 。 关于建议的开发工作流程,与 @equinor/fusion-framework-dev-server。 。 。 .
关键概念
- 门户外壳: 使上行、 上下文选择器和应用程序升起区域成为反应应用程序.
- 应用程序加载器: 动态初始化并挂载 Fusion app
appKey,处理显示解析度,脚本加载,并拆解. - 框架模块: 该门户网站预配置了遥测,导航,书签,地物旗,分析,AG Grid,Loces V2等功能,而如此上载的应用程序的服务集成则继承了现实环境.
- 辅助工作表: 当应用程序调用时打开
useHelpCenter()。一个生产形状的侧边栏列出当前应用程序的文章help服务(通常为本地帮助文件服务)ffc mock-server),并附有文章索引openHelp(),用于openFaqs(),并简单搜索文章和FAQsopenSearch()。发布注释和其他只制作的页面显示“在dev门户网站中不支持”信息。 见 本地测试帮助文章。 。 。 . - 模拟模式分析: 注册合并门户
app-loaded, (中文(简体) ),app-selected,以及context-selected收藏家们 与--mock,它也发送分析 - 包括一个应用的useTrackFeature活动——致monitor本地模拟服务器的服务,与Fusion门户网站在生产中发送的方式相同(portal.id实值dev-portal) (中文(简体) ). 无--mock,没有分析器离开浏览器fusionLogAnalytics特性旗仍然将其登录到控制台. - V2整合:人物侧工作表使用共享的紧凑角色视图,当应用程序在初始化过程中需要访问角色时,应用程序加载器可以恢复.
- 上下文导航插件: 门户启用
enableContextNavigation从@equinor/fusion-framework-plugin-context-navigation因此上下文变化,应用程序开关会自动保持URL同步.
安装
pnpm add @equinor/fusion-framework-dev-portal
环境变量
设置为 .env 文件或服务器环境中的文件 :
| 变量 | 需求 | 说明 |
|---|---|---|
FUSION_MSAL_CLIENT_ID | 对 | 用于认证的 MSAL 应用程序客户端ID |
FUSION_MSAL_TENANT_ID | 对 | Azure AD 租户身份认证 |
FUSION_SERVICE_DISCOVERY_URL | 对 | Fusion 服务发现端点的 URL |
FUSION_SERVICE_SCOPE | 对 | OAuth 服务请求范围 |
FUSION_SPA_AG_GRID_KEY | 没有 | AG Grid Entertainment 许可证密钥 — 本地沉默控制台警告 |
AG 网格许可证
当地开发期间
- 添加
FUSION_SPA_AG_GRID_KEY=<your-key>给您的.env文档. - 启动 Dev 门户网站
pnpm start。 。 。 . - 校验浏览器控制台显示没有 AG Grid 许可证警告 .
许可证密钥仅在当地使用,不得承诺存放.
快速启动
pnpm start
此启动已加载的 Dev 服务器 .
公共 API
软件包导出一个 render 函数将门户挂入 DOM 元素:
import { render } from '@equinor/fusion-framework-dev-portal';
const el = document.createElement('div');
el.id = 'dev-portal';
document.body.appendChild(el);
// `framework` is a pre-configured Fusion Framework instance with Service Discovery and MSAL
render(el, { ref: framework });
用法为 @equinor/fusion-framework-dev-server
Dev 服务器自动加载此门户. 一个典型的整合看起来像:
import { createDevServer } from '@equinor/fusion-framework-dev-server';
const portalId = '@equinor/fusion-framework-dev-portal';
const devServer = await createDevServer({
spa: {
templateEnv: {
portal: {
id: portalId,
tag: 'latest',
},
},
},
api: {
serviceDiscoveryUrl: 'https://location.of.your.service.discovery',
},
});
建筑
该门户由下列内部部分组成:
render——入站点;创建有主题,框架,和人-解提供者的回放根.configure——配置所有框架模块(遥测,导航,上下文导航,书签,地物旗,分析,AG Grid,服务).analytics/—— 说configureAnalytics登记门户的收集器和适配器,并仅在模拟监视器服务resolveMockServerUrl()找到模拟服务器来源的 dev 服务器集window.FUSION_MOCK_SERVER_URL页:1--mock。 。 。 .- 背景配置 —— 说
enableContext将上下文模块的路径生成器和路径提取器连接到共享上下文导航 URL 公用设施. Router设置路线react-router通过导航模块; 路径/apps/:appKey/*到应用程序加载器.AppLoader——解析,初始化,并按键上载一个Fusion app;处理加载状态和出错.- 角色恢复 —— 将应用程序加载器包入
AccessRoleBoundary这样用户就可以激活一个符合资格的可声明角色,并重试被屏蔽的应用程序builder.requireAccessRoles。 。 。 . Header——上行有Fusion标志,上下文选择器,书签切换,人物设置,以及帮助侧工作表.- 辅助工作表 - 听着
@Portal::FusionHelp::open列表GET /apps/{appKey}/articles在相撞的侧边栏中GET /articles/{slug}作为下标,列表GET /apps/{appKey}/faqs作为可扩展的问题,并用POST /search标志性的导航地标,aria-current,稳定data-testids (单位:千美元)help-nav-article, (中文(简体) ),help-article-title, (中文(简体) ),help-search-result, (中文(简体) ),help-not-found, (中文(简体) ),help-unsupported)支持Playwright和合成剂. - 人边表 - 招标人
<RolesView compact />反应RolesProvider(c) 积极、可要求和最近到期的角色分配. ContextSelector——连接到当前应用程序的上下文模块,用于搜索和选择上下文项目.enableContextNavigation——注册调和活性上下文和浏览器URL的门户级上下文导航插件.
门户网站启用 @equinor/fusion-framework-module-roles (b) 与经认证的帐户相抵
服务发现配置。 见 角色模块指南 联 合 国
供应商合同和 反应角色组件指南 页:1
紧凑视图和要求访问的恢复行为.
制约因素
- 这个门户是用来 仅当地发展 并不打算用于生产部署.
- 视觉可能与制作Fusion门户网站不同.
- 该门户假定了MSAL,服务发现在母框架实例中配置.