Library fluentui-blazor 微软Blazor的Fluent UI组件库

一、项目介绍

在 .NET 世界里用 Blazor 做应用，过去要么自己拼基础控件，要么引入和 WinForms 时代画风割裂的第三方库。想要一套既现代、又和微软设计语言（Fluent Design）一致、还能直接用在 ASP.NET Core Blazor 上的组件，选择并不多。
Microsoft Fluent UI Blazor 是微软官方出品的 Blazor 组件库，把 Fluent Design 设计体系做成一组原生 Blazor 组件。它和 ASP.NET Core Blazor 应用深度集成，提供按钮、表单、布局、对话框等常用控件，让你用熟悉的 Razor 语法就能搭出和微软生态风格统一的企业应用。

二、项目基本信息

三、核心优势

• 官方出品：由微软维护，与 ASP.NET Core Blazor 深度契合
• Fluent 设计：和微软生态视觉语言一致
• 原生 Blazor：基于 Razor 组件，无 JS 框架负担
• 控件齐全：按钮、表单、布局、对话框等常用件齐备
• MIT 协议：开源可改，商用无忧

四、适用场景

适合用 Blazor（Server 或 WebAssembly）构建企业内部应用、管理后台与 .NET 全栈产品的团队。希望界面与微软设计体系对齐的开发者尤为合适。

五、安装教程

当前最新版本 latest。按下方命令安装：

# 用 .NET CLI 为项目添加包：
dotnet add package Microsoft.FluentUI.Blazor

常见报错：依赖缺失时先升级对应运行环境（Node、Python、.NET、Go、Java、Rust、Bun、JDK）；网络超时多为镜像或代理问题，可重试或换源；Docker 相关命令需已安装并启动 Docker 服务；涉及 API Key 的服务请提前在环境变量或配置文件中填好。

六、使用示例

下面是一段可直接参考的真实示例：

@* _Imports.razor 中加入： *@
@using Microsoft.FluentUI.Blazor
@* Program.cs 注册服务： *@
builder.Services.AddFluentUIBlazorComponents();

@* 页面使用： *@
<FluentButton Appearance="Accent" OnClick="@OnClick">
  你好 Fluent
</FluentButton>

七、常见问题

问：支持哪些渲染模式？答：Blazor Server 与 WebAssembly 都支持。问：和 MudBlazor 比？答：FluentUI.Blazor 由微软官方维护、视觉与 Fluent Design 一致，更适合 .NET 生态项目。

八、总结

fluentui-blazor 用清晰的设计，把把界面能力做成可复用组件这件事从重复劳动变成了可复用、可维护的工程能力。它不追求大而全，而是把核心痛点解决得足够扎实，这正是日常开发与团队落地时最需要的那种工具。如果你也在被同类问题困扰，不妨按上面的安装与使用步骤试一试，把它接进自己的工作流。