107 Star 756 Fork 154

GVPAnt Design Blazor / ant-design-blazor

加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

Ant Design Blazor

一套基于 Ant Design 和 Blazor 的企业级组件库

Build AntDesign AntDesign Pro 模板 codecov AntDesign Ding Talk Group Discord Server

English | 简体中文

✨ 特性

  • 🌈 提炼自企业级中后台产品的交互语言和视觉风格。
  • 📦 开箱即用的高质量 Blazor 组件,可在多种托管方式共享。
  • 💕 支持基于 WebAssembly 的前端和基于 SignalR 的服务端 UI 即时交互。
  • 🎨 支持渐进式 Web 应用(PWA)
  • 🛡 使用 C# 构建,多范式静态语言带来高效的开发体验。
  • ⚙️ 支持 .NET Core 3.1 以上所有版本,可直接引用丰富的 .NET 类库。
  • 🌍 数十个国际化语言支持。
  • 💴 基于 MIT 开源协议,.NET 基金会项目,商业应用免费。

🌈 在线示例

WebAssembly 静态托管页面示例

🖥 支持环境

  • 支持 .NET Core 3.1 / .NET 5 / .NET 6 / .NET 7 / .NET 8。
  • 支持 WebAssembly 静态文件部署。
  • 支持主流 4 款现代浏览器,以及 Internet Explorer 11+(限 Blazor Server)。
  • 支持 .NET MAUIWPFWindows Forms 等 Blazor 混合客户端环境中。
  • 支持 Electron 等基于 Web 标准的环境上。

由于 WebAssembly 的限制,Blazor WebAssembly 不支持 IE 浏览器,但 Blazor Server 支持 IE 11†。 详见官网说明

从 .NET 5 开始,Blazor 不再官方支持 IE 11。详见 Blazor: Updated browser support。社区项目 Blazor.Polyfill 提供了非官方支持。

💿 当前版本

🎨 设计规范

与 Ant Design 设计规范定期同步,你可以在线查看同步日志

因此,你可以直接使用在 Ant Design 中的自定义主题样式。

在 1.0 版本发布之前,我们将只同步 antd 4.x 的样式。

📦 安装

先决条件

选择一:从模板创建一个新项目 Pro 模板

我们提供了 dotnet new 模板来创建一个开箱即用的 Ant Design Pro 新项目:

Pro Template

  • 安装模板

    $ dotnet new --install AntDesign.Templates
  • 从模板创建 Ant Design Blazor Pro 项目

    $ dotnet new antdesign -o MyAntDesignApp

模板的参数:

参数 说明 类型 默认值
-f | --full 如果设置这个参数,会生成所有 Ant Design Pro 页面 bool false
-ho | --host 指定托管模型 'wasm' | 'server' | 'hosted' 'wasm'
--styles 指定样式构建类型 css | less css
--no-restore 如果设置这个参数,就不会自动恢复包引用 bool false

选择二:在已有项目中引入 Ant Design Blazor

  • 进入应用的项目文件夹,安装 Nuget 包引用

    $ dotnet add package AntDesign
  • 在项目的 Program.cs 中注册相关服务:

    builder.Services.AddAntDesign();

    或者在 Startup.cs 中:

    services.AddAntDesign();
  • _Imports.razor 中加入命名空间

    @using AntDesign
  • 为了动态地显示弹出组件,需要在 App.razor 中添加一个 <AntContainer /> 组件。

    • 对于 Blazor WebApp 项目,还需要为 Routes 指定渲染模式来支持交互性。
    <Routes @rendermode="RenderMode.InteractiveAuto" />           <-- 指定渲染模式 ✨
    + <AntContainer @rendermode="RenderMode.InteractiveAuto" />   <-- 在这里添加容器 ✨
    • 对于旧版本的项目,则只需加一行代码:
    <Router AppAssembly="@typeof(MainLayout).Assembly">
        <Found Context="routeData">
            <RouteView RouteData="routeData" DefaultLayout="@typeof(MainLayout)" />
        </Found>
        <NotFound>
            <LayoutView Layout="@typeof(MainLayout)">
                <Result Status="404" />
            </LayoutView>
        </NotFound>
    </Router>
    
    + <AntContainer />   <-- 在这里添加容器 ✨
  • 最后就可以在.razor组件中引用啦!

    <Button Type="primary">Hello World!</Button>

🔨 开发

Gitpod

点击下方按钮,免费创建一个新的工作区用于开发。

Open in Gitpod

本地

  • 先安装 .NET Core SDK 8.0.100 以上版本

  • 安装 Node.js(只用于样式文件和互操作所需 TS 文件的构建)

  • 克隆到本地开发

    $ git clone git@github.com:ant-design-blazor/ant-design-blazor.git
    $ cd ant-design-blazor
    $ npm install
    $ dotnet build ./site/AntDesign.Docs.Build/AntDesign.Docs.Build.csproj
    $ npm start
  • 打开浏览器访问 https://localhost:5001 ,详情参考本地开发文档

    推荐使用 Visual Studio 2022 开发。

🔗 链接

🗺 开发路线

查看这个 issue 来了解我们在 1.0 版本的开发计划。

另外也可以关注这个 issue 了解我们关于将来对 antd 5.0 适配的讨论和最新进展。

🤝 如何贡献

PRs Welcome

如果你希望参与贡献,欢迎 Pull Request,或给我们 报告 Bug

💕 支持本项目

本项目以 MIT 协议开源,为了能得到够更好的且可持续的发展,我们期望获得更多的支持者,我们将把所得款项用于社区活动和推广。你可以通过如下任何一种方式支持我们:

我们会把详细的捐赠记录登记在 捐赠者名单

❓ 社区互助

如果您在使用的过程中碰到问题,可以通过以下途径寻求帮助,同时我们也鼓励资深用户通过下面的途径给新人提供帮助。

  • Discord Server (英文)

  • 钉钉群 (中文)

  • 另外,我还创立了面向中文开发者的 Blazor 中文社区,高手如云,只讨论技术,无卖课广告。可以加我微信(JamesYeungMVP)拉进微信群,另外也有一个 QQ 群 1012762441。广告勿扰。

贡献者

感谢所有为本项目做出过贡献的朋友。

行为准则

本项目采用了《贡献者公约》所定义的行为准则,以明确我们社区的预期行为。 更多信息请见 .NET Foundation Code of Conduct.

☀️ 授权协议

AntDesign

.NET Foundation

本项目由 .NET Foundation 支持。

MIT License Copyright (c) .NET Foundation and Contributors All Rights Reserved Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

一套基于 Ant Design 和 Blazor 的企业级组件库 (中文社区QQ群:1012762441) 展开 收起
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
C#
1
https://gitee.com/ant-design-blazor/ant-design-blazor.git
git@gitee.com:ant-design-blazor/ant-design-blazor.git
ant-design-blazor
ant-design-blazor
ant-design-blazor
master

搜索帮助

14c37bed 8189591 565d56ea 8189591