CK's Notepad

[.NET Core] Blazor - 前置環境設定

發表於 分類於 Disqus：

※此篇所介紹的技術都還在實驗階段，請勿用在 production 專案上

在去年年底(2017/11)月份左右，有一個非常有趣的 Repo 出現，叫做 Blazor 。什麼是 Blazor ? Blazor 是將 C#/Razor 與 HTML 封裝成 WebAssembly ，然後可以跑在前端的 SPA 架構。目前這框架還處於實驗架構，但我們還是可以建立一個專案來玩玩看，這篇先介紹環境的安裝

前置條件

  • .NET Core SDK (> 2.1.4)
  • Node.js (> 8.3)

如果使用 Visual studio 2017 者，需要更新至 15.6 版本，或者使用 preview 版本也可以

安裝專案範本

Visual Studio 2017

  • 將 https://dotnet.myget.org/f/blazor-dev/vsix 新增到 Extension Galleries 內

  • Nuget 套件來源也需要新增 https://dotnet.myget.org/f/blazor-dev/vsix

  • 更新安裝下列兩個套件，都需要關掉 Visual Studio 2017 才可以完成安裝動作

    • Razor Language Services (NOTE: When you later uninstall the Razor Language Services VSIX you will need to do a VS repair to bring back the old one)
    • ASP.NET Core Blazor Language Services

一旦完成上續的動作後，即可獲得 Blazor 的專案範本

使用 Command-line

透過以下指令可以安裝專案範本

1
dotnet new -i Microsoft.AspNetCore.Blazor.Templates::0.1.0-* --nuget-source https://dotnet.myget.org/F/blazor-dev/api/v3/index.json

之後的建立 Blazor 專案的方式就可以使用 dotnet new blazor 或是 dotnet new blazorhosted 的方式完成

第一次啟動

在 restore 和 建置後，第一次啟動網站，你會看到很熟悉畫面

開啟開發者介面，也可以看到一堆 dll 檔案被下載到瀏覽器了 XD

相關資源