使用 Blazor 创建浏览器插件

使用 Blazor 创建浏览器插件

本文仅是对参考文档的主要快速开始部分的简单翻译，剩下还请参考 https://mingyaulee.github.io/Blazor.BrowserExtension/ 。

0. 参考资料

1. B站视频 https://www.bilibili.com/video/BV1uM4m127Ko
2. 参考文档 https://mingyaulee.github.io/Blazor.BrowserExtension/
3. github 项目 https://github.com/mingyaulee/Blazor.BrowserExtension
4. github 项目 https://github.com/tvaccari34/BlazorChromeExtensions

1. 安装和构建

1. 安装

dotnet new --install Blazor.BrowserExtension.Template

2. 创建新项目

dotnet new browserext --name MyBlazorExtension

3. 构建

cd MyBlazorExtension
dotnet build

生成出来的插件会放在 MyBlazorExtension/bin/Debug/net8.0/browserextension 这个文件夹中。

Tips

If you are using Visual Studio, after installing the template, you can create a new project and build it from the Visual Studio UI.

提示

如何你使用的是 Visual Studio，在安装完插件后，你能创建一个新项目然后通过 Visual Studio 的 UI 进行编译。

在浏览器中运行插件

由于译者只有 Microsoft Edge，所以仅对 Microsoft Edge 的部分进行翻译。

Microsoft Edge

1. 打开拓展页

2. 切换至开发者模式
   

3. 点击 加载解压缩的扩展，导航到对应项目的 bin/Debug/net8.0 选择 browserextension 文件夹。

4. 点击 加载解压缩的扩展，导航到对应项目的 bin/Debug/net8.0 选择 browserextension 文件夹（重复两遍）。

5. 点击 加载解压缩的扩展，导航到对应项目的 bin/Debug/net8.0 选择 browserextension 文件夹（重复三遍）。
   注意要是 browserextension 文件夹！
   

原文:

1. Launch the Extensions page ( ⋮ → Extensions).
2. Click on the ☰ and switch on Developer mode.
3. Click on the button with the title Load unpacked, then navigate to bin/Debug/net8.0 and select the browserextension directory.

Google Chrome

1. Launch the Extensions page ( ⋮ → More tools → Extensions).
2. Switch on Developer mode.
3. Click on the Load unpacked button, then navigate to bin/Debug/net8.0 and select the browserextension directory.

Mozilla Firefox

1. Navigate to the URL about:debugging#/runtime/this-firefox. You need to copy this link and paste it in the address bar.
2. Click on Load Temporary Add-on..., then navigate to bin/Debug/net8.0/browserextension and select any file in the directory.