1. 背景
需要在 ThingsBoard 页面下面添加页脚标签,首先想到的是可不可以修改配置文件或者安装目录内的一些 html 文件来完成添加,检索之后发现该方法不可行,原因是 html 页面都被编译到 thingsboard.jar
文件中去了,无法直接修改。另一种思路就是修改 ThingsBoard 的源码,然后再编译。
版本:3.1
2. 添加页脚标签
下载源码:https://github.com/thingsboard/thingsboard
检出所需版本,例如:
1
git checkout release-3.1
修改 ui-ngx/src/index.html
文件,添加 footer
标签,例如(原有的某些部分在这里使用 … 代替显示):
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!doctype html>
<html lang="en" style="width: 100%;">
<head>
...
</head>
<body class="tb-default">
...
<div class="footer">
<li>
<a>© 2021 XXXX</a>
</li>
</footer>
</body>
</html>
<style >
.footer{
position:absolute;
left: 0;
right: 0;
bottom:0; /* 位于底部 */
text-align:center; /* 居中显示 */
z-index: 30; /* 位于上层 */
}
</style>
其他的页面都会使用这个页面作为模板,所以只需要修改这个文件即可。
3. 替换标题
修改以下文件中的 appTitle
的值:
- ui-ngx/src/environments/environment.prod.ts
- ui-ngx/src/environments/environment.ts
修改以下文件中 title
标签的内容
- ui-ngx/src/index.html
4. 修改页面语言
修改以下文件中的 defaultLang
的值:
- ui-ngx/src/environments/environment.prod.ts
- ui-ngx/src/environments/environment.ts
1
defaultLang: 'zh_CN'
5. 从源码编译 ThingsBoard
如果需要生成安装包,按官方指导文档编译 ThingsBoard[1]:
1
sudo apt-get install maven
编译:
1
2
3
4
# clean 会删除 target,没必要的话不用加。
mvn clean install
# 或者
mvn clean package
产物位于 application/target
。
如果已经安装过了,使用 application/target/thingsboard-3.1.1-boot.jar
替换 thingsboard.jar 即可:
- windows: thingsboard/lib/thingsboard.jar
- ubuntu: /usr/share/thingsboard/bin/thingsboard.jar
6. 故障解决
(1) yarn 网络连接问题
[INFO] — frontend-maven-plugin:1.7.5:yarn (yarn install) @ ui-ngx — [INFO] Running ‘yarn install’ in /mnt/f/wsl/source/thingsboard/ui-ngx [INFO] yarn install v1.22.4 [INFO] [1/4] Resolving packages… [INFO] [2/4] Fetching packages… [INFO] info There appears to be trouble with your network connection. Retrying… [INFO] info There appears to be trouble with your network connection. Retrying…
设置代理:
1
2
3
4
# https
./ui-ngx/target/node/yarn/dist/bin/yarn config set https-proxy http://127.0.0.1:50657
# http
./ui-ngx/target/node/yarn/dist/bin/yarn config set proxy http://127.0.0.1:50657
或修改 yarn 源:
1
2
3
4
5
6
7
8
./ui-ngx/target/node/yarn/dist/bin/yarn config get registry
# http://registry.npmjs.org/
./ui-ngx/target/node/yarn/dist/bin/yarn config set registry http://registry.npm.taobao.org/
# yarn config v1.22.4
# success Set "registry" to "http://registry.npm.taobao.org/".
# Done in 0.03s.
# 继续编译
mvn install -rf :ui-ngx
(2) 端口占用
如果本地已经安装并启动了 ThingsBoard 以及 Postgres,需要将二者关闭,否则编译源码过程中进行的单元测试会受影响(端口被占用)。
如果是 windows,停止相关的服务,例如:
- ThingsBoard Server Application
- postgresql-x64-11 - PostgreSQL Server 11
参考
[1] https://thingsboard.io/docs/user-guide/install/building-from-source/