由于BootstrapBlazor升级到6.9以后的升级还是非常大的,比如图标库升级到了6.1.2,bs升级到了5.2.0。所以这里记录一下升级过程。
升级BootstrapBlazor主程序
直接升级BootstarpBlazor到最新版本,没有错误,但是我们会发现我们的BootstrapBlazor自带图标全部变成方块了。这就需要升级图标库。
升级图标库
由于这个项目使用BootstrapBlazor的时间比较早,当时还没有BootstrapBlazor.Fontawasome的扩展库,我们是直接内部引用了fontawasome的css库。
在现在看已经不合时宜了,因为BootstrapBlazor已经有了扩展库,我们可以直接用扩展库来处理我们的图标库,随时跟着项目升级走。
所以我们直接从NuGet中安装BootstrapBlazor.FontAwasome
。然后参照官网的安装说明,将我们_AdminHost.cshtml
中的<link rel="stylesheet" href="/Admin/css/font-awesome.min.css">
改为引用NuGet包中的<link href="_content/BootstrapBlazor.FontAwesome/css/font-awesome.min.css" rel="stylesheet">
。
这时候我们重启项目,发现BootstrapBlazor自带的图标已经全部正常了,但是我们菜单上有部分图标异常,比如我们的文章列表图标,需要由fa fa-newspaper-o
修改为fa-solid fa-newspaper
但是两者样式也不完全相同。同样,我们的页面列表图标也需要由fa fa-file-o
修改为fa-regular fa-file
。
其他的图标目前来看正常,后期可能会有进一步修改。
清理原来的图标文件
由于我们的图标css直接由NuGet来提供了,所以我们原来的图标库相关的css还有font即可直接删除掉。
这里我们wwwwroot/Admin
下的css
文件夹和fonts
文件夹就可以完全删除了。
这样我们就把BootstrapBlazor升级完成了。
标签:Jx,fa,图标库,升级,BootstrapBlazor,Cms,我们,图标 From: https://www.cnblogs.com/j4587698/p/16655414.html