DevExpress Template (.NET CLI)
- 4 minutes to read
Important
Ensure your system meets these requirements.
This topic describes how to:
- Install the DevExpress.Blazor.ProjectTemplates NuGet package and use the DevExpress Template to create a Blazor project from CLI.
- Register the NuGet feed to access the DevExpress.Blazor NuGet package that includes DevExpress components.
- Add DevExpress components to a project.
You can execute CLI commands in any command line interpreter: Command Prompt (CMD), Visual Studio Code and macOS terminals, and others.
1. Install DevExpress Templates
Download the DevExpress.Blazor.ProjectTemplates NuGet package and install it.
dotnet new -i DevExpress.Blazor.ProjectTemplates
After the installation is completed, the following DevExpress Template is available:
You can also run the command below to see the list of available template options (such as framework version or render mode):
dotnet new dx.blazor -h
2. Obtain Your DevExpress NuGet Feed Credentials
You need to obtain your personal NuGet feed credentials to access the DevExpress.Blazor NuGet package from your project. You can use NuGet feed URL or feed authorization key to manage DevExpress packages.
Make sure your DevExpress.com account has access to Blazor UI Components. This product line is included in the Universal, DXperience, and ASP.NET subscriptions. Refer to the subscription comparison matrix for more information.
Use your DevExpress credentials to log into nuget.devexpress.com.
Obtain your NuGet feed credentials and copy them to the clipboard.
You can find the same URL in the Download Manager.
3. Register the NuGet Feed as a Package Source
Add the feed as a package source to your NuGet configuration files. To do this, create the nuget.config
file with the following content:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<packageSources>
<add key="MyGet" value="https://api.nuget.org/v3/index.json" />
<add key="DevExpress Nuget server" value="https://nuget.devexpress.com/{your-feed-authorization-key}/api/v3/index.json" />
</packageSources>
</configuration>
Alternatively, you can use console commands:
# Register packages with an authorization key
dotnet nuget add source https://nuget.devexpress.com/api/v3/index.json -n DXFeed -u DevExpress -p {your-feed-authorization-key}
# Register packages with a feed URL
dotnet nuget add source https://nuget.devexpress.com/{your-feed-authorization-key}/api/v3/index.json -n DXFeed
Refer to the following topic for more information: Install NuGet Packages with Command Line Interface (CLI) Tools.
An error can occur if the specified source is already in the source list. You can run dotnet nuget list source
to view all the configured sources and ensure the specified and nuget.org
package sources are enabled. To enable them, use the dotnet nuget enable source
command.
4. Create a New Project
Based on the render mode and framework version, run one of the following commands to create a project:
DevExpress Blazor App for .NET 6 or .NET 7:
dotnet new dx.blazor -n MyBlazorServerApp -f net7.0 -int Server
DevExpress Blazor App for .NET 8:
dotnet new dx.blazor -n MyBlazorInteractiveServerApp -f net8.0 -int Server
The newly created project references the DevExpress.Blazor NuGet package. NuGet automatically restores this package if you registered the DevExpress NuGet feed.
Note
You can also pass the NuGet feed as a -nf
parameter when you create a project.
dotnet new dx.blazor -n MyBlazorServerApp -nf https://nuget.devexpress.com/{your-feed-authorization-key}/api/v3/index.json
The command creates the project and adds the NuGet.config file with the DevExpress feed to the project folder.
5. Run the Application
Use the corresponding command from the list below to run the application:
DevExpress Blazor App for .NET 6 or .NET 7:
cd MyBlazorServerApp dotnet run
DevExpress Blazor App for .NET 8:
cd MyBlazorInteractiveServerApp dotnet run
The command output contains the application URL that can differ depending on the host:
Now listening on: http://localhost:5000
Open your browser and navigate to the URL to see the result.
6. Add More DevExpress Components
For instructions on how to add an individual DevExpress Blazor component to your application, refer to the documents below: