本来以为很简单的事,但其中问题不断,写在此愿能帮助遇到同样问题的你。
要实时查看logo替换效果,建议在热部署模式下运行,官方文档:https://thingsboard.io/docs/user-guide/contribution/how-to-contribute/#running-ui-container-in-hot-redeploy-mode

定制自己的logo

我这边使用的是在线网页制作svg:https://c.runoob.com/more/svgeditor/

  1. 准备工作
    把thingsboard原logo(存在此路径下:/UI/src/svg/log_tilte_white.svg)导入在线制作svg网页
  2. 制作
    导入成功后按delete把导入的thingsboard logo背景删除(主要是为了保证图片尺寸跟原thingsboard大致一致)

编辑制作好的svg代码

把thingsboard源logo的头部复制到你制作好的svg头部(个人理解主要是为了保证宽度高度的一致)

thingsboard源logo头部

<svg id="svg2" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="320" width="1543.4" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 1543.4268 320.00026">

编译

把图片拷贝到thingsboard原位置,重新编译打包(要先把thingsboard根路径下的pom.xml中的license-maven-plugin插件注释了)