Getting started
1. Install
bit BlazorUI components are available as the Bit.BlazorUI NuGet package, which can be integrated into your project using one of the methods below:
1. Command Line: Run the following command to install the package:
dotnet add package Bit.BlazorUI
2. Package Manager Console: Execute the command below to install the package:
Install-Package Bit.BlazorUI
3. Visual Studio: Use Visual Studio's NuGet Package Manager interface to add the package to your project.
Extra components: If you want to use the Extra components (like BitChart) you need to add the Bit.BlazorUI.Extras package:
dotnet add package Bit.BlazorUI.Extras
Install-Package Bit.BlazorUI.Extras
Optional assets: If you need the asset files of the bit BlazorUI (like Segoe UI font for non-Windows clients) you need to add the Bit.BlazorUI.Assets package:
dotnet add package Bit.BlazorUI.Assets
Install-Package Bit.BlazorUI.Assets
Icon pack: If you want to use the Fabric Icons of the bit BlazorUI (using BitIconName class) you need to add the Bit.BlazorUI.Icons package:
dotnet add package Bit.BlazorUI.Icons
Install-Package Bit.BlazorUI.Icons
2. Namespace
Open the
_Imports.razor
file of your Blazor application and add this line:@using Bit.BlazorUI
3. Styles and Scripts
Open
App.razor
or
index.html
file and add the CSS file reference:
<link href="_content/Bit.BlazorUI/styles/bit.blazorui.css" rel="stylesheet" />
then add the JS file file reference:
<script src="_content/Bit.BlazorUI/scripts/bit.blazorui.js"></script>
Extra components: If you are using the
Extras
package you also need to add these resources:
<link href="_content/Bit.BlazorUI.Extras/styles/bit.blazorui.extras.css" rel="stylesheet" />
<script src="_content/Bit.BlazorUI.Extras/scripts/bit.blazorui.extras.js"></script>
Optional assets: If you are using the
Assets
package you also need to add this resource:
<link href="_content/Bit.BlazorUI.Assets/styles/bit.blazorui.assets.css" rel="stylesheet" />
Icon pack: If you are using the
Icons
package you also need to add this resource:
<link href="_content/Bit.BlazorUI.Icons/styles/bit.blazorui.icons.css" rel="stylesheet" />