Blazor 创建项目详细教程

8次阅读

创建 Blazor 项目需先安装。NET SDK(推荐。NET 8)和 VS 2022 17.8+;CLI 命令:dotnet new blazorserver -n MyBlazorApp -f net8.0 或 dotnet new blazorwasm -n MyWasmApp -f net8.0 –hosted;VS 中选择对应模板并勾选“.NET 8.0”及“ASP.NET Core 托管”即可快速生成可运行项目。

Blazor 创建项目详细教程

用 Visual Studio 或 .NET CLI 创建 Blazor 项目非常直接,关键是要选对模板和目标框架。下面分步骤讲清楚怎么创建一个可用的 Blazor 项目,包括服务端(Blazor Server)和 WebAssembly(Blazor WASM)两种主流类型。

确认 开发环境 已就绪

Blazor 是 .NET 生态的一部分,必须先装好对应版本的 .NET SDK(推荐 .NET 8 或 .NET 9,目前 LTS 版本是 .NET 8)。打开终端或命令行,运行:

dotnet –version

如果显示版本号(如 8.0.400),说明 SDK 已安装。Visual Studio 用户建议使用 VS 2022 17.8+,并勾选“ASP.NET 和 Web 开发”工作负载。

用 CLI 快速创建 Blazor Server 项目

这是最轻量、适合内网或快速原型的方案,所有逻辑在服务器执行,实时通过 SignalR 推送 UI 更新。

dotnet new blazorserver -n MyBlazorApp -f net8.0

  • -n MyBlazorApp:指定项目名和文件夹名
  • -f net8.0:明确指定目标框架(避免默认用最新预览版)
  • 生成后进入目录:cd MyBlazorApp
  • 运行:dotnet run浏览器 打开 https://localhost:5001 即可看到首页

用 CLI 创建 Blazor WebAssembly(WASM)项目

适合部署到静态网站(如 GitHub Pages、Azure Static Web Apps),代码下载到浏览器中运行,支持 PWA 和离线能力。

dotnet new blazorwasm -n MyWasmApp -f net8.0 –hosted

  • –hosted:加上这个参数会生成“托管式”结构——包含一个 ASP.NET Core 后端 API 项目 + 一个独立的 WASM 前端 项目,方便调用服务端接口
  • 不加 --hosted 就是纯客户端项目(无后端,只能调外部 API 或本地存储)
  • 运行整个托管方案:dotnet run(默认启动后端,前端自动由后端提供)

用 Visual Studio 图形界面创建(更直观)

打开 VS →“创建新项目”→ 搜索 Blazor → 选择以下任一模板:

  • Blazor Server App:选“.NET 8.0”框架,认证方式按需选(如“无身份验证”)
  • Blazor WebAssembly App:勾选“ASP.NET Core 托管”即等效 CLI 的 --hosted
  • 点击“创建”,VS 自动还原 NuGet 包并生成完整解决方案
  • F5 运行即可,调试体验比 CLI 更友好(断点、热重载都支持)

基本上就这些。创建完项目后,Pages/Counter.razorPages/FetchData.razor 是两个典型示例页面,可以马上改着试。注意区分 Program.cs 中的服务注册方式(Server 用 AddServerSideBlazor(),WASM 用 AddBlazorWebAssemblyHostedService() 等),后续扩展功能时别混用。

星耀云
版权声明:本站原创文章,由 星耀云 2026-01-02发表,共计1406字。
转载说明:转载本网站任何内容,请按照转载方式正确书写本站原文地址。本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。
text=ZqhQzanResources