ant design blazor下載 - ant design blazor源代碼下載

ant design blazor

其他源碼

1.0.1

下載

螞蟻設計大麻

基於Ant Design和Glazor的一組豐富的企業級UI組件。

英語| 簡體中文

特徵

？企業級UI專為Web應用程序設計。
？開箱即用的一組高質量的大火組件。
？支持基於WebAssembly的客戶端和基於信號的服務器端UI事件交互。
？支持漸進式Web應用程序（PWA）。
？使用C＃構建，這是一種多範式靜態語言，可提供有效的開發體驗。
？國際化支持數十種語言。
？與現有的ASP.NET核心MVC和Razor頁面項目無縫集成。

？在線示例

WebAssembly靜態託管：

文檔網站
企業系統儀表板

？環境支持

支持.NET CORE 3.1 / .NET 5 / .NET 6 / .NET 7 / .NET 8 / .NET 9。
支持WebAssembly靜態文件部署。
支持4個主要的瀏覽器引擎和Internet Explorer 11+（僅限式服務器）
支持.NET MAUI / WPF / Windows表單和其他Blazor Hybrid Workloads。
支持電子和其他基於Web標準的環境。

由於WebAssembly限制，因此Blazor WebAssembly不支持IE瀏覽器，但是Blazor Server支持IE 11†具有其他polyfills。請參閱官方文檔。

從.NET 5開始，IE 11不再得到正式支持。請參閱《大火：更新的瀏覽器支持》。非官方支持由Blazor.Polyfill社區項目提供。

？當前版本

發布：
每晚：
下載我們最新的夜間構建

？設計規範

定期與官方的螞蟻設計規範同步，您可以在線檢查同步日誌。

因此，您可以直接使用螞蟻設計的自定義主題樣式。

在1.0發布之前，我們將僅同步ANTD 4.X樣式。

？安裝指南

先句

安裝.NET Core SDK 3.1.300或更高版本，.NET 8甚至更好。

選項1：從dotnet新模板創建一個新項目

我們提供了dotnet new模板，以創建一個樣板項目：

Pro模板

安裝模板

$ dotnet new --install AntDesign.Templates

使用模板創建樣板項目

$ dotnet new antdesign -o MyAntDesignApp

模板的選項：

選項	描述	類型	預設
`-f` \| `--full`	如果指定，生成螞蟻設計專業的所有頁面	布爾	錯誤的
`-ho` \| `--host`	指定託管模型	'WebApp'\| 'wasm'\| '服務器'	'WebApp'
`--styles`	是否使用nodejs和更少的編譯您的自定義主題。	`css` \| `less`	`css`
`--no-restore`	如果指定，請在創建時跳過項目的自動還原	布爾	錯誤的

選項2：將螞蟻設計大黃器導入現有項目

轉到應用程序的項目文件夾並安裝Nuget軟件包參考
```
$ dotnet add package AntDesign
```

在Program.cs中註冊服務

 builder . Services . AddAntDesign ( ) ;

或Startup.cs

 services . AddAntDesign ( ) ;

在_Imports.razor中添加名稱空間
```
 @using AntDesign
```

在適當的地方介紹CSS和JS文件。 WebApp項目是在App.Razor中引入的，WebAssembly項目在index.html中介紹

  < link href =" _content/AntDesign/css/ant-design-blazor.css " rel =" stylesheet " >
  < script src =" _content/AntDesign/js/ant-design-blazor.js " > </ script >

要動態顯示彈出組件，您需要在App.razor中添加<AntContainer />組件。

對於Blazor WebApp，您還需要將渲染模式指定為<Routes />以進行交互。

<Routes @rendermode="RenderMode.InteractiveAuto" />            <-- specify the rendermode 
+ <AntContainer @rendermode="RenderMode.InteractiveAuto" />    <-- add this component

對於舊式應用應用程序，只需添加一條代碼即可：

<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 />   <-- add this component

最後，可以在.razor組件中引用它！

< Button Type = " @ButtonType.Primary " >Hello World!</ Button >

？發展

gitpod

單擊下面的按鈕以啟動新的工作空間免費開發。

當地的

安裝.NET Core SDK 9.0.100或更高版本。
安裝node.js（僅用於構建樣式文件和可互操作的打字稿文件）

克隆到本地發展

$ git clone https://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